extJS中常用的4種Ajax非同步提交方式_extjs

/**

複製程式碼 程式碼如下:

* 第一種Ajax提交方式

* 使用這種方式，需要將待傳遞的參數進行封裝
* @return
*/
function saveUser_ajaxSubmit1() {
Ext.Ajax.request( {
url : 'user_save.action',
方法: 'post',
params; : {
使用者名稱: document.getElementById('userName').value,
密碼: document.getElementById('password').value
},
成功: 函數(回應, 選項) {
var o = Ext.util.JSON.decode(response.responseText);
alert(o.msg);
},
失敗: function() {
}
});
}
/**
* 第二種Ajax提交方式
* 這種方式將為ext的ajax指定一個html表單
* 使用這種方式，不需要將待傳遞的參數進行封裝
*
* @return
*/
function saveUser_ajaxSubmit2() {
Ext.Ajax.request( {
url : 'user_save.action' >方法: ' post',
form : 'userForm', // 指定表單
success : function(response, options) {
var o = Ext.util.JSON.decode(response.responseText) ;警報(o.msg);
},
失敗: function() {
}
});
}
/**
* 第三種Ajax提交方式
* 這種方式將為ext的自己的表單進行提交
* 使用這種方式，需要使用ext自己的textField組件
*
* @return
*/
function saveUser_ajaxSubmit3() {
//定義表單
var formPanel = new Ext.FormPanel( {
labelWidth : 75,
frame : true,
標題,
寬度: 350,
預設值: {
寬度: 230
},
defaultType : 'textfield ',
items : [ {
fieldLabel : '使用者名稱',
name : '使用者名稱',
allowBlank : false
}, {
fieldLabel : '密碼',
姓名: '密碼'
}]
} );
// 定義視窗
var win = new Ext.Window( {
title : '新增使用者',
layout : 'fit',
寬度: 500,
高度: 300,
closeAction : '關閉',
closeable : 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',
method : 'post',
success : function(form, action) {
alert (action.result.msg);
},
失敗：函數(form, action) {
alert(action.result.msg); );
}
}, {
text : '取消',
處理程序: function() {
win.close();
}
} ]
});
win.show() ;
}
/**
* 第四種Ajax提交方式
* 這種方式將html的表單轉換為ext的表單進行非同步提交
* 使用這種方式，需要定義好html的表單
*
* @return
*/
function saveUser_ajaxSubmit4() {
new Ext.form.BasicForm('userForm').submit( {
waitTitle : '請稍後...',
waitMsg : '正在保存使用者訊息，請稍後...',
url : 'user_save.action',
method : 'post',
success : function (表單, 操作) {
警報(action.result.msg)
},
失敗: 函數(表單, 操作) {
警報(action.result.msg); }
});
}