extJS提交form表单数据的方式: Ext.Ajax.request,form.submit,getEl().dom.submit()

extJS提交服务器主要有这样几种方式: Ext.Ajax.request,form.submit,getEl().dom.submit(),以下是详细介绍:

1、EXT的form表单ajax提交（默认提交方式）

相对单独的ajax提交来说优点在于能省略写参数数组，将按钮添加单击事件，执行以下方法

 
        function 
         loginSubmit(item) { 
       
        if 
         (validatorForm()) {
       
        // 登录时将登录按钮设为disabled，防止重复提交
       
        this
        .disabled = 
        true
        ; 
       
        // 第一个参数可以为submit和load
       
        formPanl.form.doAction(
        'submit'
        , { 
       
        url : 
        'login.do?method=login'
        , 
       
        method : 
        'post'
        , 
       
        // 如果有表单以外的其它参数，可以加在这里。
       
        //我这里暂时为空，也可以将下面这句省略
       
        params : 
        ''
        , 
       
        // 第一个参数是传入该表单，
       
        //第二个是Ext.form.Action对象用来取得服务器端传过来的json数据
       
        success : 
        function
        (form, action) { 
       
        Ext.Msg.alert(
        '操作'
        , action.result.data);
       
        this
        .disabled = 
        false
        ; 
       
        },
       
        failure : 
        function
        (form, action) { 
       
        Ext.Msg.alert(
        '警告'
        , 
        '用户名或密码错误！'
        );
       
        // 登录失败，将提交按钮重新设为可操作
       
        this
        .disabled = 
        false
        ; 
       
        }
       
        });
       
        this
        .disabled = 
        false
        ;
       
        }
       
        }

2、EXT的form表单直接submit提交

 
        var 
         fp = Ext.create(
        'Ext.form.Panel'
        , {
       
        ...
       
        buttons: [{
       
        text: 
        'Save'
        ,
       
        formBind: 
        true
        ,
       
        handler: 
        function
        (){
       
        if
        (fp.getForm().isValid()){
       
        fp.getForm().submit({
       
        url: 
        'form-submit.php'
        ,
       
        waitMsg: 
        '请稍后,正在提交数据...'
        ,
       
        success: 
        function
        (form, action){
       
        Ext.Msg.alert(
        '操作'
        , action.result.data);
       
        },
       
        failure: 
        function
        (form, action){
       
        if 
         (action.failureType === Ext.form.action.Action.CONNECT_FAILURE) {
       
        Ext.Msg.alert(
        '错误'
        ,
        'Status:'
        +action.response.status+
        ': '
        +
       
        action.response.statusText);
       
        }
       
        if 
         (action.failureType === Ext.form.action.Action.SERVER_INVALID){ 
       
        Ext.Msg.alert(
        'Invalid'
        , action.result.errormsg);
       
        }
       
        }
       
        });
       
        }
       
        } 
       
        },{
       
        text: 
        'Reset'
        ,
       
        handler: 
        function
        (){
       
        fp.getForm().reset();
       
        }
       
        }]
       
        });

3、Extjs form表单的非ajax提交

在表单需加入下列代码 :

 
        //实现非AJAX提交表单一定要加下面的两行
       
        // onSubmit : Ext.emptyFn, submit : function() {  
       
        //再次设定action的地址  
       
        this
        .getEl().dom.action =
        'login.do?userName=login'
        ;
       
        this
        .getEl().dom.method = 
        'post'
        ;  
       
        //提交submit
       
        this
        .getEl().dom.submit();
       
        }

4、Extjs form表单的Ext.Ajax.request提交

 
        Ext.Ajax.request({
       
        //请求地址
       
        url: 
        'login.do'
        ,
       
        method:
        'post'
        ,
       
        //提交参数组
       
        params: {
       
        userName:Ext.get(
        'userName'
        ).dom.value,
       
        userPassword:Ext.get(
        'userPassword'
        ).dom.value
       
        },
       
        //成功时回调
       
        success: 
        function
        (response, options) {
       
        //获取响应的json字符串
       
        var 
         json = Ext.util.JSON.decode(response.responseText);  
       
        if
        (json.success==
        true
        ){
       
        Ext.Msg.alert(
        '恭喜'
        ,
        '您已成功登录!'
        );     
       
        }
       
        else
        {
       
        Ext.Msg.alert(
        '失败'
        ,
        '登录失败，请重新登录'
        ); 
       
        }
       
        })
       
        });