Question

这是分配给我的控制器中change textfield事件的函数：

checkFields: function (field, ov, nv, e) {

    switch (field.name) {

        case 'currentPassword':
        case 'newPassword':
        case 'confirmNewPassword':
            //set button state depending on form's element values...
            var form = Utils.getCmp('form[itemId=changePasswordForm]');
            var values = form.getForm().getValues();

            if (values.newPassword != values.confirmNewPassword) {
                this.changePwdButton().setDisabled(true);
                this.utils.getCmp('textfield[name=confirmNewPassword]').markInvalid(this.strings.Messages.str_ErrorPwdMatch);
                return false;
            }
            else {
                this.utils.getCmp('textfield[name=confirmNewPassword]').markInvalid(false);
            }

            if (!form.isValid()) {
                this.changePwdButton().setDisabled(true);
                return false;
            }

            this.changePwdButton().setDisabled(false);
            return true;
            break;

    }
}

当'newPassword'文本字段触发此操作时，将confirmNewPassword标记为无效的块工作正常，但当它由confirmNewPassword本身触发时，它可以正常工作，但随后会被撤消（当有效函数返回时，标记为有效）

如果我在通过confirmNewPassword触发时跟随调用堆栈，代码最终会在框架中达到此目的：

checkChange: function() {
    if (!this.suspendCheckChange) {
        var me = this,
            newVal = me.getValue(),
            oldVal = me.lastValue;
        if (!me.isEqual(newVal, oldVal) && !me.isDestroyed) {
            me.lastValue = newVal;
            me.fireEvent('change', me, newVal, oldVal);
            me.onChange(newVal, oldVal); //this line undos prevous markInvalid()
        }
    }
}

为什么会这样做？感谢。

Answer 1

这是因为onChange函数调用了validate函数，而且这个函数调用了isValid函数！

onChange: function(newVal, oldVal) {
    if (this.validateOnChange) {
        this.validate();
    }
    this.checkDirty();
},

validate : function() {
    var me = this,
        isValid = me.isValid();
    if (isValid !== me.wasValid) {
        me.wasValid = isValid;
        me.fireEvent('validitychange', me, isValid);
    }
    return isValid;
},

isValid : function() {
    var me = this;
    return me.disabled || Ext.isEmpty(me.getErrors());
},

您的目标是，只有当两个密码字段具有相同的值时才启用更改密送Btn ！因此，您应该覆盖isValid函数，而不是侦听更改事件。

顺便说一下：你应该使用var form = Utils.getCmp('form[itemId=changePasswordForm]');而不是使用var form = field.up('form[itemId=changePasswordForm]');，而是搜索整个DOM，而不是搜索你的元素，只是向上搜索！）

Answer 2

我将confirmNewPassword的标记更改为：

{
    fieldLabel: strings.UI.str_ConfirmNewPassword,
    xtype: 'textfield',
    inputType: 'password',
    name: 'confirmNewPassword',
    validateOnChange: false //this line fixed it
}

现在它有效。

从另一个文本字段的更改事件中标记文本字段无效是撤消的

2 个答案: