javascript - 通过 AJAX 调用问题 knockout 自定义验证

Question

我的自定义验证将验证在表单字段中输入的邮政编码对于从前面字段的下拉列表中选择的州是否有效。当我第一次选择一个州，然后输入有效/无效的邮政编码时，它工作正常。但是，如果它验证，然后我去选择不同的状态，则验证错误消息不会触发。谁能告诉我我缺少什么以及为什么它没有重新验证？

自定义验证:

ko.validation.rules["isValidZipCode"] =
    {
        async: true,
        getValue: function (o) {
            return (typeof o === 'function' ? o() : o);
        },
        validator: function (val, fields, callBack) {
            var self = this;
            var anyOne = ko.utils.arrayFirst(fields, function (field) {
                var val = self.getValue(field);

                if (val === undefined || val === null) 
                    return "";                
                return true;
            });

            var ajaxData = { state: anyOne, zipCode: val }
            $.ajax({
                url: $("a#ValidateZipByState").attr("href"),
                type: "POST",
                data: ajaxData,
                success: function (isValid) {
                    if (isValid) {
                        callBack(true);
                    } else {
                        callBack(false);
                    }
                },
                error: handleSubmitError
            });

            return;
        },
        message: "Invalid zip code for this state"
    };

View 模型:

self.State = ko.observable(model.State).extend({ required: true });
self.ZipCode = ko.observable(model.ZipCode).extend({ required: true, pattern: /^[0-9]{5}(?:-[0-9]{4})?$/g, isValidZipCode: [self.State, self.ZipCode] });

Answer 1

您可以添加对 State 的订阅，并使用 ko.validation.validateObservable 方法来触发对 ZipCode 的验证 - 另外，由于此验证规则特定于 ZipCode，因此您可以使用匿名自定义规则规则。

self.State = ko.observable("StateB").extend({ 
    required: true
});

self.State.subscribe(function(){
    ko.validation.validateObservable(self.ZipCode);
})

self.ZipCode = ko.observable(789).extend({
    validation: {
        async: true,
        validator: function (val, params, callback) {
            setTimeout(function() {
                var zips = stateZips.get(self.State());
                var exists = zips.some(function(zip) {
                    return zip == new Number(val);
                });
                return callback(exists);
            });
        },
        message: "Invalid zip code for this state"
    }
});

此处的完整示例:JSFiddle

编辑:为了使 State 触发验证(不首先更改 ZipCode)，您必须使用:

ko.validation.init({ messagesOnModified: false });