Knockoutjs 验证 areSame 或 MustMatch 示例

我正在尝试使用 GitHub 上的 Knockoutjs 验证插件。大部分似乎工作得很好，但是当我尝试使用扩展验证 MustEqual(password/confirm password) 时，它似乎没有做任何事情。我缺少什么？

我非常想学习这种扩展技术以供将来使用。

（整个 html 和 javascript 也通过 AJAX 调用加载到页面。如果这与它有任何关系的话。）

我的 JavaScript

    function UserAccount(data) {
        var self = this;
        self.Password = ko.observable(data.Password).extend({ required: true, minlength: 6, message: "Password is required", maxLength: 12 });

        self.Firstname = ko.observable(data.Firstname).extend({ required: true, minlength: 6, message: "Firstname is required", maxLength: 40 });
        self.Lastname = ko.observable(data.Lastname).extend({ required: true, minlength: 6, message: "Lastname is required", maxLength: 40 });
        self.Email = ko.observable(data.Email).extend({ required: true, minlength: 6, message: "Email is required", email: true, maxLength: 90 });
        self.ConfirmPassword = ko.observable().extend({ mustEqual: self.Password()});
        ...........................Other Code............
        }

    ko.validation.rules['mustEqual'] = {
        validator: function (val, otherVal) {
            alert("Hello");
            return val === otherVal;
        },
        message: 'The field must equal {0}'
    };
    $(document).ready(function () {


        ko.applyBindings(new UserAccount(initdata), $("#UserAccount").get(0));
        ko.validation.registerExtenders();

    });

您的自定义验证器代码没问题。但是你没有正确调用ko.validation.registerExtenders();方法。

虽然没有明确说明，但你需要调用ko.validation.registerExtenders(); before你正在打电话ko.applyBindings.

因此，要修复您的代码，您只需编写：

$(document).ready(function () {
    ko.validation.registerExtenders();
    ko.applyBindings(new UserAccount(initdata), $("#UserAccount").get(0));
});

但你会面临另一个问题：mustEqual验证器用于与静态值进行比较，因此如果您想比较密码和确认密码等两个属性，它将不起作用。

你需要的是类似的东西用户贡献的“相同”验证器 https://github.com/Knockout-Contrib/Knockout-Validation/wiki/User-Contributed-Rules#are-same:

ko.validation.rules['areSame'] = {
    getValue: function (o) {
        return (typeof o === 'function' ? o() : o);
    },
    validator: function (val, otherField) {
        return val === this.getValue(otherField);
    },
    message: 'The fields must have the same value'
};

你可以使用什么，例如：

self.Password = ko.observable(data.Password).extend({
    required: true,
    minlength: 6,
    message: "Password is required",
    maxLength: 12
});
self.ConfirmPassword = ko.observable().extend({
    areSame: self.Password
});

Demo JSFiddle http://jsfiddle.net/nemesv/trvz7/1.