KnockoutJS动态表单验证

Question

我有一个有三个字段组的表单，点击“添加新”按钮，其他三个字段组将被添加。那部分工作得很好。

我想添加验证，因此需要所有三个字段才能添加新组。

此处参考的代码是：http://jsfiddle.net/5g8Xc/

var ContactsModel = function(contacts) {
    var self = this;
    self.contacts = ko.observableArray(ko.utils.arrayMap(contacts, function(contact) {
        return { firstName: contact.firstName, fathersLast: contact.fathersLast, country: contact.country };
    }));

    self.addContact = function() {
        self.contacts.push({
            firstName: "",
            fathersLast: "",
            country: ""
        });
    };

    self.removeContact = function(contact) {
        self.contacts.remove(contact);
    };
};

有关如何实施此验证的任何线索？我试图使用jquery验证来做到这一点，但我认为使用KnockoutJS是可能的。

感谢任何建议。

Answer 1

如上所述，the validation plugin将是最优雅，更少创新的解决方案。

修改：使用验证插件评论后implementation

除此之外，你还有几个选择。

• 如果您确信联系对象将始终只包含必填字段，那么不太强大的实现将迭代联系人的属性，确保每个都有一些价值。

• 稍微强一点，但仍然缺乏插件的优雅，实现将是维护一系列必需字段并使用该数组进行验证。您可以参考my example进行此设置。实质上，每个必需属性都映射到observables。对任何可观察属性的值所做的更改会触发（通过subscription）对computed中使用的虚拟可观察对象的突变调用。这是必需的，因为计算机无法调用valueHasMutated。突变调用触发计算重新评估，从而更新UI。