淘汰赛验证视图模型绑定未显示正确错误答案

【问题标题】：Knockout Validation viewmodel binding not showing correct errors淘汰赛验证视图模型绑定未显示正确错误
【发布时间】：2013-01-14 21:31:22
【问题描述】：

已更新以显示带有建议更改的工作示例，该更改将我的 viewModel 更改为根据 Thewads 建议验证的Observable。花了很长时间才让事情顺利进行，但它现在显示了正确的错误计数！

<fieldset>
    <legend>Test</legend>
     <label>First name: <input data-bind='value: model.Employee.FirstName'/></label>
     <label>Last name: <input data-bind='value: model.Employee.LastName'/></label>
    <button type="button" data-bind='click: buttons.submit'>Submit</button>
</fieldset>


<script>

my = {namespace: { }}
my.namespace.obj = function () {
    var bindingHandler = function (data) {

        initializeValidation = (function () {
            ko.validation.configure({
                registerExtenders: true,
                decorateElement: true,
                messagesOnModified: true,
                insertMessages: true,
                parseInputAttributes: true,
                messageTemplate: null,
                grouping: { deep: true }
            });
        })();

         viewModel = ko.validatedObservable({
             model: ko.mapping.fromJS(data),
             buttons: {
                 submit: function () {
                     if (viewModel.isValid()) {
                         alert('VM clean');
                     } else {
                         alert('Errors found');
                         viewModel.errors.showAllMessages();
                     }
                 }
             }

        });

         extendedValidators = (function () {
             viewModel().model.Employee.FirstName.extend({ minLength: 20, required: true });
             viewModel().model.Employee.LastName.extend({ minLength: 30, required: true });
         })();

         applyBindings = (function () {
             ko.applyBindings(viewModel);
         })();
    }
    return {
        fn: {
            Initialize: function (model) {
                bindingHandler(model);
            }
        }
    };
};

$(document).ready(function () {
    model = { "Employee": { "FirstName": "Joe", "LastName": "Shmoe" } };
    my.namespace.obj().fn.Initialize(model);
});

【问题讨论】：

标签： knockout.js knockout-mapping-plugin knockout-validation

【解决方案1】：

您必须使用 validObservable 来正确验证，而不仅仅是普通的 observable。

应该是这样的：

validationCheck = ko.validatedObservable( whatYouAreValidating() ) )
if (validationCheck.isValid() )
     //do your logic

或者通过使用验证组：

validationGroupCheck = ko.validation.group( whatYouAreValidating())

if ( validationGroupCheck().length <= 0 )
    return true

【讨论】：

请注意，您也可以考虑使用 ko.validation.group。这一切都取决于您的需求。 validateObservable 收集错误消息，但将 ViewModel 包装在一个 observable 中，validation.group 只存储验证消息。如果你需要，我可以举个例子
是的，你能给我看一个验证组的例子吗？我希望能够检查我的视图模型是否无效，但我是否需要将其作为验证的Observable 来执行此操作？
@cjsmith 我已经更新了我的答案以显示验证组。我相信，您可以将其中任何一种用于您正在使用的验证。如果您一次验证数百个 observable，请小心使用validatedObservable，因为性能会受到影响。在这些情况下，Validation.groups 稍微快一些

【解决方案2】：

我根本无法让它运行。你能让它在 jsFiddle 中运行吗？

但是，看起来很奇怪的一件事是，您的代码中没有任何内容调用您的 extendedValidators 方法，所以我猜验证器尚未初始化。除非它只是在您的帖子中丢失？

【讨论】：

实际上，废弃 jsFiddle，我正在努力让淘汰赛验证加载到 jsFiddle！
extendedValidators 是自执行的，不需要直接调用它 - 测试你可以在那里抛出一个警报，它会触发
我不知道，谢谢！我在文档中看不到任何提及它，这就是我正在做的事情。
哦，是的，它的名字可以是你想要的任何名字——它不在文档中，因为它不是专门针对淘汰验证的，而是 javascript；那是我添加到我的视图模型中的一个功能，与初始化相同
对了，明白了，没注意到这是一个自调用函数！