Extjs Ext JS 4.1-用户定义的验证不'；t绑定按钮

我定义了一个验证，用于控制id是否唯一以绑定按钮。它可以很好地与内置验证配合使用但是它不适合我自己的验证

以下是我尝试过的：

查看-表单面板：

Ext.define(appName + '.view.user.UserForm', {
    extend: 'Ext.form.Panel',
    requires: [appName + '.view.language.LanguageCombo'],
    alias: 'widget.userform',
    //  title       : 'User Form',
    iconCls: 'icon-form',
    frame: true,
    padding: '5 5 0 5',
    border: true,
    buttonAlign: 'right',
    width: '100%',
    //    height    : 200,
    monitorValid: true,
    bodyPadding: 10,
    fieldDefaults: {
        labelAlign: 'left',
        labelWidth: 110,
        anchor: '98%',
        allowBlank: false,
        selectOnFocus: true,
        msgTarget: 'side'
    },
    initComponent: function () {
        var me = this;


        this.title = bundle.getMsg('userform.title');


        this.items = [{
            xtype: 'numberfield',
            minValue: 1,
            fieldLabel: bundle.getMsg('userform.field.recordId'),
            name: 'recordId',
            itemId: 'recordId'
        }, {
         ];


        this.btnReset = Ext.create('Ext.ux.button.ResetButton', {
            handler: function (btn) {
                me.getForm().reset();
            }
        });


        this.btnSubmit = Ext.create('Ext.ux.button.SaveButton', {
            disabled: true, 
            formBind: true
        });


        this.buttons = [me.btnReset, me.btnSubmit];


        this.callParent(arguments);
    }
});

var form = this.getUserForm();
if (field.getValue() && field.getValue() != '') {
    Ext.Ajax.request({
        url: 'user/chkRecordIdUnique.ajax',
        method: 'POST',
        params: {
            recordId: field.getValue()
        },
        success: function (response, options) {
            var res = Ext.decode(response.responseText);
            if (!res.success) {
                field.markInvalid(bundle.getMsg('record.taken'));
                form.getForm().markInvalid(bundle.getMsg('record.taken'));
            }
        }
    });
}

控制器方法：

Ext.define(appName + '.view.user.UserForm', {
    extend: 'Ext.form.Panel',
    requires: [appName + '.view.language.LanguageCombo'],
    alias: 'widget.userform',
    //  title       : 'User Form',
    iconCls: 'icon-form',
    frame: true,
    padding: '5 5 0 5',
    border: true,
    buttonAlign: 'right',
    width: '100%',
    //    height    : 200,
    monitorValid: true,
    bodyPadding: 10,
    fieldDefaults: {
        labelAlign: 'left',
        labelWidth: 110,
        anchor: '98%',
        allowBlank: false,
        selectOnFocus: true,
        msgTarget: 'side'
    },
    initComponent: function () {
        var me = this;


        this.title = bundle.getMsg('userform.title');


        this.items = [{
            xtype: 'numberfield',
            minValue: 1,
            fieldLabel: bundle.getMsg('userform.field.recordId'),
            name: 'recordId',
            itemId: 'recordId'
        }, {
         ];


        this.btnReset = Ext.create('Ext.ux.button.ResetButton', {
            handler: function (btn) {
                me.getForm().reset();
            }
        });


        this.btnSubmit = Ext.create('Ext.ux.button.SaveButton', {
            disabled: true, 
            formBind: true
        });


        this.buttons = [me.btnReset, me.btnSubmit];


        this.callParent(arguments);
    }
});

var form = this.getUserForm();
if (field.getValue() && field.getValue() != '') {
    Ext.Ajax.request({
        url: 'user/chkRecordIdUnique.ajax',
        method: 'POST',
        params: {
            recordId: field.getValue()
        },
        success: function (response, options) {
            var res = Ext.decode(response.responseText);
            if (!res.success) {
                field.markInvalid(bundle.getMsg('record.taken'));
                form.getForm().markInvalid(bundle.getMsg('record.taken'));
            }
        }
    });
}

---

根据文档，

markInvalid

实际上不会改变字段的有效性。它只是应用视觉样式，就好像字段有错误一样。并且没有要设置的

isValid

属性。所有有效性都是通过立即调用

isValid

方法来确定的

目前，ExtJS表单不支持本机异步验证。它假定所有验证都在客户端完成，或者服务器将执行验证。如果您想在启用save按钮之前执行Ajax调用以确定表单是否有效，我建议您使用成功回调创建自己的validate方法。如果Ajax调用成功并且表单的其余部分有效，则手动启用save按钮。然后在表单更改时，可以再次禁用“保存”按钮

---

旁注：

width

应该是一个数字，而不是一个百分比。

@Erick Cook感谢您的关心，但实际上这只是一个代码示例。所以我也必须检查其他字段。所以我不能手动启用或禁用表单绑定按钮，或者我应该为每个用户定义的验证执行此操作；这没有意义。如果每个字段都可以独立验证，那么可以使用同步Ajax在

字段.validator

函数中执行验证。ExtJS不支持通过

Ext.Ajax.request

执行，因此您必须手动执行（应该很容易设置）。事实上，我最近不得不自己做，所以这是可能的。如果字段依赖于其他字段，则应该真正考虑删除<代码>格式绑定< /COD>并只做所有的验证/启用您自己。好的，非常感谢埃里克，看来我应该像您一样实现它。但如果核心库这样做会更好；当一个标记为无效的字段（因此表单变为无效）时，一个带有formBind:true的按钮也会生效。表单验证过程还有很大的改进空间。