extjs表单FormPanel提交数据和加载数据

流浪鱼

在使用Extjs中，除了GridPanel以为，使用最多的应该用的是FormPanel了，在使用FormPanel肯定少不了，数据的提交和加载，现在本人总结下FormPanel数据提交和加载的方法
1.FormPanel数据提交包括两种方式，一种是使用BasicForm的submit方式进行ajax的异步提交，另一种是使用原始的HTML表单的提交方式
1.1BasicForm的submit方式进行ajax的异步提交
form.getForm().submit({    url: '<%=request.getContextPath()%>/formsort.do?method=test',    waitTitle : '请等待' ,    waitMsg: '正在提交中',    success:function(form,action){//url后台返回的数据{success:true,msg:'成功'}                    Ext.Msg.alert('提示','保存'+action.result.msg);    },    failure:function(form,action){Ext.Msg.alert('提示','保存失败！');    }}); 完整代码如下：
 
var form = new Ext.form.FormPanel({frame : true ,defaultType : 'textfield' ,buttonAlign : 'center' ,labelAlign : 'right' ,//此处添加url，那么在getForm().sumit方法不需要在添加了url地址了url: '<%=request.getContextPath()%>/formsort.do?method=saveOrUpdateFormSort', baseParams : {create : true },labelWidth : 70 ,items : [{fieldLabel : 'id' ,xtype : 'hidden',name : 'formSortUuid'},{fieldLabel : '名称' ,name : 'sortName'},{fieldLabel : '描述' ,xtype : 'textarea' ,name : 'description'}] ,buttons : [{text : '确定' ,handler : function(){    //FormPanel自身带异步提交方式    form.getForm().submit({    //url: '<%=request.getContextPath()%>/formsort.do?method=saveOrUpdateFormSort',    waitTitle : '请等待' ,    waitMsg: '正在提交中',    success:function(form,action){//url后台返回的数据{success:true,msg:'成功'}                    Ext.Msg.alert('提示','保存'+action.result.msg);    },    failure:function(form,action){Ext.Msg.alert('提示','保存失败！');    }   }); }} ]});  
1.2原始的HTML表单的提交方式
采用原始的提交方式需要覆盖掉BasicForm的onSubmit和submit方法，完了直接调用submit即可
代码如下：
var form = new Ext.form.FormPanel({frame : true ,defaultType : 'textfield' ,buttonAlign : 'center' ,labelAlign : 'right' ,baseParams : {create : true },//覆盖BasicForm的onSubmit方法onSubmit: Ext.emptyFn,//覆盖BasicForm的submit方法submit: function() {    form.getForm().getEl().dom.action = '<%=request.getContextPath()%>/formsort.do?method=saveOrUpdateFormSort' ;    form.getForm().getEl().dom.submit();},labelWidth : 70 ,items : [{fieldLabel : 'id' ,xtype : 'hidden',name : 'formSortUuid'},{fieldLabel : '名称' ,name : 'sortName'},{fieldLabel : '描述' ,xtype : 'textarea' ,name : 'description'}] ,buttons : [{text : '确定' ,handler : function(){ /*采用传统的HTML的同步提交*/         form.getForm().submit();}} ]});  说明：在BasicForm中有一个standardSubmit : Boolean
<div class="mdesc">如果此项设置为true，将使用标准的HTML表单提交代替XHR（Ajax）方式的提交。 (默认值为 false)