extJs常用的四种Ajax异步提交

/** * 第一种Ajax提交方式 * 这种方式需要直接使用ext Ajax方法进行提交 * 使用这种方式，需要将待传递的参数进行封装 * @return */ function saveUser_ajaxSubmit1() { Ext.Ajax.request( { url : 'user_save.action',method : 'post',params : { userName : document.getElementById('userName').value,password : document.getElementById('password').value },success : function(response,options) { var o = Ext.util.JSON.decode(response.responseText); alert(o.msg); },failure : function() { } }); } /** * 第二种Ajax提交方式 * 这种方式将为ext的ajax指定一个html表单 * 使用这种方式，不需要将待传递的参数进行封装 * * @return */ function saveUser_ajaxSubmit2() { Ext.Ajax.request( { url : 'user_save.action',form : 'userForm',// 指定表单 success : function(response,failure : function() { } }); } /** * 第三种Ajax提交方式 * 这种方式将为ext的自己的表单进行提交 * 使用这种方式，需要使用ext自己的textField组件 * * @return */ function saveUser_ajaxSubmit3() { // 定义表单 var formPanel = new Ext.FormPanel( { labelWidth : 75,frame : true,bodyStyle : 'padding:5px 5px 0',width : 350,defaults : { width : 230 },defaultType : 'textfield',items : [ { fieldLabel : '用户名',name : 'userName',allowBlank : false },{ fieldLabel : '密 码',name : 'password' } ] }); // 定义窗口 var win = new Ext.Window( { title : '添加用户',layout : 'fit',width : 500,height : 300,closeAction : 'close',closable : false,plain : true,items : formPanel,buttons : [ { text : '确定',handler : function() { var form = formPanel.getForm(); var userName = form.findField('userName').getValue().trim(); var password = form.findField('password').getValue().trim(); if (!userName) { alert('用户名不能为空'); return; } if (!password) { alert('密码不能为空'); return; } form.submit( { waitTitle : '请稍后...',waitMsg : '正在保存用户信息,请稍后...',url : 'user_save.action',success : function(form,action) { alert(action.result.msg); },failure : function(form,action) { alert(action.result.msg); } }); } },{ text : '取消',handler : function() { win.close(); } } ] }); win.show(); } /** * 第四种Ajax提交方式 * 这种方式将html的表单转化为ext的表单进行异步提交 * 使用这种方式，需要定义好html的表单 * * @return */ function saveUser_ajaxSubmit4() { new Ext.form.BasicForm('userForm').submit( { waitTitle : '请稍后...',action) { alert(action.result.msg); } });