挖空自定义验证 ajax 问题



我正在尝试验证输入到表单字段中的邮政编码对于从前面字段中的下拉列表中选择的州是否有效。我将所有数据都放在一个表中,并且能够使用 ajax 调用进行确认。我下面的代码允许我使 ajax 调用返回真/假,但我不确定如何根据返回值触发验证。有人有想法吗?

自定义验证:

ko.validation.rules["isValidZipCode"] =
    {
        getValue: function (o) {
            return (typeof o === 'function' ? o() : o);
        },
        validator: function (val, fields) {
            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) {
                        return true;
                    } else {
                        return false;
                    }
                },
                error: handleSubmitError
            });
            return;
        },
        message: "Invalid zip code for this state"
    };

视图模型:

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] });

看起来您需要在验证定义上设置异步标志,然后才能将结果返回给回调参数。参考

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) {
                callback(isValid);
            },
            error: handleSubmitError
        });
        return;
    },
    message: "Invalid zip code for this state"
};

您正在执行异步验证。您需要处理第三个参数以validator

   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); // HERE
                } else {
                    callback(false); // HERE
                }
            },
            error: handleSubmitError
        });
        return;
    },

最新更新