淘汰赛js输入字段中的验证答案

【问题标题】：Validation in knockout js input fields淘汰赛js输入字段中的验证
【发布时间】：2014-10-13 13:54:17
【问题描述】：

我使用 KnockoutJS 创建了一些输入字段，现在我想验证它们。

http://jsfiddle.net/sohimohit/43zkoszu/12/

我尝试使用验证插件，但它不起作用。我添加了该插件并按照提到的方式使用它，但没有得到解决方案。当您单击“添加字段”时，会出现一个表单；我想将 name 字段设为必填字段，并将 branch id 设为数字。但是，当我点击“添加字段”时，它不会被添加，直到表单得到验证。

我怎样才能做到这一点？

【问题讨论】：

您的 Fiddle 包含 400 多行 JavaScript（不完全是紧凑的复制品），但其中没有一行 Knockout Validation（至少您没有使用任何 extend observables 添加验证规则）。好像您要求我们为您编写代码。
我试过了，但我的代码停止工作，这就是我从代码中删除验证部分的原因
现在它太宽泛了。不要指望任何人为您提供完整的实现。尝试自己实现它，当您遇到问题时，您将能够提出更具体的问题。通常，这些具体问题之前已经有人问过（并回答过！）。

标签： validation knockout.js knockout-validation

【解决方案1】：

您没有正确进行验证。我推荐这种方法

设置一些设置

ko.validation.configure({
    insertMessages: false,
    decorateElement: true,
    errorElementClass: 'error-element',
    errorClass: 'error-element',
    errorsAsTitle: true,
    parseInputAttributes: false,
    messagesOnModified: true,
    decorateElementOnModified: true,
    decorateInputElement: true
});

使输入与validationElement绑定

<input type="text" placeholder="Name" data-bind="value:name,validationElement:name">    
<input type="text" placeholder="Branch" data-bind="value:branch,validationElement:branch">

扩展可观察对象

self.name = ko.observable().extend({required:true})
self.branch = ko.observable().extend({required:true,digit: true})

现在应用规则。我更喜欢团体

var data = [
    self.name,
    self.branch
]

self.Errors = ko.validation.group(data);

现在添加按钮包装您的代码

self.Add = function(){
    if(self.Errors.length == 0){
        .
        .
        .
        //Your code here
    }else{
        self.Errors.showAllMessages()
    }
}

希望对你有帮助

【讨论】：

你甚至包括了 knockout.js 吗？
是的，我将它包括在内。在小提琴上没有错误，这里是链接jsfiddle.net/sohimohit/43zkoszu/11，但数据仍然未经验证即可提交。
jsfiddle.net/sohimohit/43zkoszu/12 我没有输入这个词，它仍然在传递。如果错误长度为零，我会发出警报，如果我不在名称字段中输入单词，则会显示它
您在视图模型之外定义 self.Error 问题
如果你查看最新的小提琴，即jsfiddle.net/sohimohit/43zkoszu/12，我会在视图模型中定义它。