/**
Copy the code code as follows:
* The first Ajax submission method
* This method requires direct use of the ext Ajax method for submission
* Using this method, the parameters to be passed need to be encapsulated
* @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() {
}
});
}
/**
* The second Ajax submission method
* This method will specify an html form for ext's ajax
* Using this method, there is no need to encapsulate the parameters to be passed
*
* @return
*/
function saveUser_ajaxSubmit2() {
Ext.Ajax.request( {
url: 'user_save.action',
method: 'post',
form : 'userForm', // Specify the form
success : function(response, options) {
var o = Ext.util.JSON.decode(response.responseText);
alert(o.msg);
},
failure : function() {
}
});
}
/**
* The third Ajax submission method
* This method will submit the ext's own form
* To use this method, you need to use ext's own textField component
*
* @return
*/
function saveUser_ajaxSubmit3() {
// define form
var formPanel = new Ext.FormPanel( {
labelWidth: 75,
frame: true,
bodyStyle : 'padding:5px 5px 0',
width: 350,
defaults : {
width: 230
},
defaultType: 'textfield',
items : [ {
fieldLabel: 'username',
name : 'userName',
allowBlank : false
}, {
fieldLabel : 'password',
name: 'password'
} ]
});
//define window
var win = new Ext.Window( {
title: 'Add User',
layout: 'fit',
width: 500,
height: 300,
closeAction: 'close',
closable : false,
plain : true,
items : formPanel,
buttons : [ {
text: 'OK',
handler: function() {
var form = formPanel.getForm();
var userName = form.findField('userName').getValue().trim();
var password = form.findField('password').getValue().trim();
if (!userName) {
alert('Username cannot be empty');
return;
}
if (!password) {
alert('Password cannot be empty');
return;
}
form.submit({
waitTitle: 'Please wait...',
waitMsg: 'Saving user information, please wait...',
url: 'user_save.action',
method: 'post',
success : function(form, action) {
alert(action.result.msg);
},
failure : function(form, action) {
alert(action.result.msg);
}
});
}
}, {
text: 'Cancel',
handler: function() {
win.close();
}
} ]
});
win.show();
}
/**
* The fourth Ajax submission method
* This method converts html forms into ext forms for asynchronous submission
* To use this method, you need to define the html form
*
* @return
*/
function saveUser_ajaxSubmit4() {
new Ext.form.BasicForm('userForm').submit( {
waitTitle: 'Please wait...',
waitMsg: 'Saving user information, please wait...',
url: 'user_save.action',
method: 'post',
success : function(form, action) {
alert(action.result.msg);
},
failure : function(form, action) {
alert(action.result.msg);
}
});
}