关于Ext formPanel.getForm().submit()步骤与standardSubmit属性的一些事 _Web前端

关于Ext formPanel.getForm().submit()方法与standardSubmit属性的一些事

版本 Extjs 3.3.1 ??

查看API文档，发现formPanel.getForm()是一个BasicForm对象，submit方法定义如下：

submit (?Object?options ?) : BasicForm

options : Object

The options to pass to the action (see doAction for details).

Note: this is ignored when using the standardSubmit option.

The following code:

myFormPanel.getForm().submit({
    clientValidation: true,
    url: 'updateConsignment.php',
    params: {
        newStatus: 'delivered'
    },
    success: function(form, action) {
       Ext.Msg.alert('Success', action.result.msg);
    },
    failure: function(form, action) {
        switch (action.failureType) {
            case Ext.form.Action.CLIENT_INVALID:
                Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');
                break;
            case Ext.form.Action.CONNECT_FAILURE:
                Ext.Msg.alert('Failure', 'Ajax communication failed');
                break;
            case Ext.form.Action.SERVER_INVALID:
               Ext.Msg.alert('Failure', action.result.msg);
       }
    }
});

would process the following server response for a successful submission:

{
    "success":true, // note this is Boolean, not string
    "msg":"Consignment updated"
}

?and the following server response for a failed submission:

{
    "success":false, // note this is Boolean, not string
    "msg":"You do not have permission to perform this operation"
}

上面API中可以非常明确的看到，这样的submit方法是其实一种异步提交，会返回json字符串，而是否返回成功或失败的根本因素在于json "success"值是否是 true(而且是Boolean类型，非字符串)。这与Ext.ajax.request方法的返回依据是不同的。

另外还有很重要的一点，就是上述红色字体所标注的地方

Note: this is ignored when using the standardSubmit option.

也就是说，我们定义的formPanel中没有standardSubmit 属性时，就是上述过程。但如果 standardSubmit 为true ,就是同步提交了，也就会忽略 options 参数，在里面定义的url、params都会失效。这个时候需要是用另外的方法，先看下API中关于 standardSubmit属性的定义:

standardSubmit : Boolean

If set to true , standard HTML form submits are used instead of XHR (Ajax) style form submissions. Defaults to false .

Note: When using standardSubmit , the options to submit are ignored because Ext's Ajax infrastracture is bypassed. To pass extra parameters (e.g. baseParams and params ), utilize hidden fields to submit extra data, for example:

new Ext.FormPanel({
    standardSubmit: true,
    baseParams: {
        foo: 'bar'
    },
    url: 'myProcess.php',
    items: [{
        xtype: 'textfield',
        name: 'userName'
    }],
    buttons: [{
        text: 'Save',
        handler: function(){
            var fp = this.ownerCt.ownerCt,
                form = fp.getForm();
            if (form.isValid()) {
                // check if there are baseParams and if
                // hiddent items have been added already
                if (fp.baseParams && !fp.paramsAdded) {
                    // add hidden items for all baseParams
                    for (i in fp.baseParams) {
                        fp.add({
                            xtype: 'hidden',
                            name: i,
                            value: fp.baseParams[i]
                        });
                    }
                    fp.doLayout();
                    // set a custom flag to prevent re-adding
                    fp.paramsAdded = true;
                }
                form.submit();
            }
        }
    }]
});

这个时候需要在formPanel本身添加参数baseParams，并在handler中添加相应的处理方法。