ExtJs中form表单提交的三种方式

ExtJs中form表单提交的三种方式

第一种：

function login(){

formServer.form.submit();//提交

}

function reset(){

formServer.form.reset();//取消

}

var formServer=new Ext.FormPanel({

frame:true,

width:300,

monitorValid:true,//绑定验证

layout:"form",

labelWidth:70,

title:"添加个人信息",

labelAlign:"left",

renderTo:"formServer",

submit: function(){

this.getEl().dom.action = 'human.do?method=saveHuman',

this.getEl().dom.method='POST',

this.getEl().dom.submit();

},

items:[

{

xtype:"textfield",

fieldLabel:"用户名",

//id:"UserName",

allowBlank:false,

blankText:"不能为空，请正确填写",

name:"UserName",

anchor:"90%"

},

{

xtype:"textfield",

fieldLabel:"昵称",

//id:"SmallName",

name:"SmallName",

anchor:"90%"

},

{

xtype:"datefield",

fieldLabel:"注册日期",

//id:"RegDate",

name:"RegDate",

anchor:"90%"

}],

buttons:[

{

text:"确定",

handler:login,

formBind:true

},

{

text:"取消",

handler:reset

}]

});

第二种：

function login()

{

this.disabled = true; // 登录时将登录按钮设为disabled，防止重复提交

formServer.form.doAction('submit', { //第一个参数可以为submit和load

url : 'human.do?method=saveHuman',

method : 'post',

params : '', // 如果有表单以外的其它参数，可以加在这里。我这里暂时为空，也可以将下面这句省略

// 第一个参数是传入该表单，第二个是Ext.form.Action对象用来取得服务器端传过来的json数据

success : function(form, action) {

Ext.Msg.alert('操作','操作成功！');

this.disabled = false;

},

failure : function(form, action) {

Ext.Msg.alert('警告', '用户名或密码错误！');

// 登录失败，将提交按钮重新设为可操作

this.disabled = false;

}

});

this.disabled = false;

}

第三种：

Ext.Ajax.request({

url: 'login.do', //请求地址

//提交参数组

params: {

LoginName:Ext.get('LoginName').dom.value,

LoginPassword:Ext.get('LoginPassword').dom.value

},

//成功时回调

success: function(response, options) {

//获取响应的json字符串

var responseArray = Ext.util.JSON.decode(response.responseText);

if(responseArray.success==true){

Ext.Msg.alert('恭喜','您已成功登录！');

}

else{

Ext.Msg.alert('失败','登录失败，请重新登录');

}

}

});