extjs-->form

表单元素什么的就等下再说,看这个.

在submit的配置项中的failure配置项的对应函数的action参数:

failureType:The type of failure detected will be one of these:CLIENT_INVALID, SERVER_INVALID, CONNECT_FAILURE, or LOAD_FAILURE.

说明了到底是什么原因导致进入failure对应的函数了.

CLIENT_INVALID

Failure type returned when client side validation of the Form fails thus aborting a submit action. Clientside validation is performed unless Ext.form.action.Submit.clientValidation is explicitly set tofalse.

CONNECT_FAILURE

Failure type returned when a communication error happens when attempting to send a request to the remoteserver. The response may be examined to provide further information.

LOAD_FAILURE : 

Failure type returned when the response's success property is set to false, or no field values are returnedin the response's data property.

SERVER_INVALID : 

Failure type returned when server side processing fails and the result's success property is set tofalse.

In the case of a form submission, field-specific error messages may be returned in the result'serrors property.

我们返回的json中需要有success这个属性当success不为真(为false或不存在此属性)直接进入failure对应的函数,success为true时,才进入success中

 var leftPanel = Ext.create('Ext.form.Panel', {
                region: 'west',
                width: 300,
                resizable: {
                    minWidth: 200,
                    maxWidth: 400
                },
                defaultType: 'textfield',
                defaults: {
                    width: 200
                },
                labelAlign: 'right',
                items: [
                    {
                        fieldLabel: '用户名'
                    },
                    {
                        fieldLabel: '密码',
                        inputType: 'password'
                    },
                    {
                        xtype: 'checkbox',
                        boxLabel: '低级程序员',
                        name: 'ptype'
                    },
                    {
                        xtype: 'checkbox',
                        boxLabel: '中级程序员',
                        name: 'ptype'
                    },
                    {
                        xtype: 'checkbox',
                        boxLabel: '高级程序员',
                        name: 'ptype'
                    },
                    {
                        xtype: 'combo',
                        fieldLabel: '下拉框框',
                        store: Ext.create('Ext.data.Store', {
                            fields: ['value', 'name'],
                            data: [
                                {"value": "AL", "name": "Alabama"},
                                {"value": "AK", "name": "Alaska"},
                                {"value": "AZ", "name": "Arizona"}
                            ]
                        }),
                        queryModel: 'local',
                        valueField: 'value',
                        displayField: 'name'
                    },
                    {
                        xtype: 'datefield',
                        fieldLabel: '日期',
                        maxValue: new Date()
                    },
                    {
                        xtype: 'displayfield',
                        fieldLabel: '显示信息',
                        value: '只是显示数据而已'
                    },
                    {
                        xtype: 'filefield',
                        name: 'photo',
                        fieldLabel: '头像',
                        msgTarget: 'side',
                        buttonText: '选择'
                    },
                    {
                        xtype: 'numberfield',
                        name: 'bottles',
                        fieldLabel: '数字',
                        value: 25,
                        maxValue: 100,
                        minValue: 1
                    },
                    {
                        xtype: 'fieldcontainer',
                        fieldLabel: '尺寸',
                        defaultType: 'radiofield',
                        defaults: {
                            flex: 1
                        },
                        layout: 'hbox',
                        items: [
                            {
                                boxLabel: '中',
                                name: 'size',
                                inputValue: 'm',
                                id: 'radio1'
                            },
                            {
                                boxLabel: 'L',
                                name: '大',
                                inputValue: 'l',
                                id: 'radio2'
                            },
                            {
                                boxLabel: '加大',
                                name: 'size',
                                inputValue: 'xl',
                                id: 'radio3'
                            }
                        ]
                    }
                ],
                buttons: [
                    {
                        text: '提交',
                        handler: function () {
                            leftPanel.getForm().submit({
                                url: 'a.json',
                                failure: function (form, action) {
                                    Ext.Msg.alert('出错了', '错误信息:'+action.failureType);
                                },
                                success: function (form, action) {
                                    if (action.result.result)
                                        Ext.Msg.alert('结果正常', '提示信息:' + action.result.msg);
                                    else
                                        Ext.Msg.alert('结果失败', '提示信息:' + action.result.msg);
                                }
                            });
                        }
                    }
                ]
            })
            ;

这就是一个表单了.看最后一点点代码就可以了.

当a.json不包含success这个属性的时候

{
    //"success":true,
    "result": true,
    "msg": "出错了,无法连接到数据库"
}

,报错如图

当包含success时

{
    "success":true,
    "result": true,
    "msg": "出错了,无法连接到数据库"
}

结果如图

当success为假时

{
    "success":false,
    "result": true,
    "msg": "出错了,无法连接到数据库"
}

看图,和success不存在时是一样的.