ExtJS Form 为我们提供了两个方法:load 和 submit,分别用来加载和提交数据,这两个方法都是异步的。
Form 加载
var formCmp = this.up("form"); formCmp.setLoading(); formCmp.load({ url: "FormLoadDataServer", params: { id: "" //可能需要告诉服务器要加载数据的id,或者一些其它参数 }, success: function (form, action) { formCmp.setLoading(false); }, failure: function (form, action) { formCmp.setLoading(false); Ext.Msg.alert("失败", action.result.message); } });
在这段代码中,首先获得form组件,然后通过setLoading()方法显示遮罩层,最后调用load方法加载数据。
load方法的参数是一个配置对象
- url:加载数据的地址
- params:请求数据用到的参数
- success:加载到数据以后的回调方法,这个方法会在数据绑定以后执行
- failure:加载数据失败时的回调方法
Form 提交
var formCmp = this.up("form"); if (!formCmp.isValid()) return; formCmp.submit({ url: "FormSubmitDataServer", success: function (form, action) { Ext.Msg.alert("提示", action.result.message); }, failure: function (form, action) { Ext.Msg.alert("失败", action.result.message); } });
form的提交方法是通过submit方法完成的,这个方法和load方法相似,都需要一个配置对象,这个对象在执行请求时候用到。
在线示例
示例截图如下:
当点击加载数据按钮的时候:
点击提交按钮: