映射后的Knockout验证

时间:2014-01-16 13:02:40

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

我是淘汰赛的新手所以请耐心等待。

我正在尝试使用映射插件将从服务器接收的Json数据映射到现有的viewModel实例。我可以毫无问题地做到这一点。但在我的viewModel中,我使用了验证插件,因此只要我映射数据并将其绑定到UI,验证就会启动并立即显示错误信息。

在单击提交按钮之前,是否可以不显示该错误消息。或者我做错了什么?

这是Jsfiddle link

由于某种原因,SO不允许我提交此问题,除非附有代码,所以这里是从jsfiddle复制的javascript代码 -

 ko.validation.configure({
      parseInputAttributes: true
 });

 var data = { name: null, email: "joe@shmo.com" };

 function vm(){
   this.name = ko.observable().extend({required:true});
   this.email = ko.observable().extend({required:true});
   this.validationCheck = ko.validatedObservable(this);
 }


 var viewModel = ko.mapping.fromJS(data, {}, new vm());
 ko.applyBindings(viewModel);

1 个答案:

答案 0 :(得分:0)

您可以尝试的一种方法是最初隐藏所有验证消息,然后将功能添加到您再次显示它们的viewmodel。然后在单击提交按钮时调用该函数。

    ko.validation.configure({
    parseInputAttributes: true
});

var data = { name: "Joe Shmo", email: "joe@shmo.com" };

var validationMapping = {
    'name': {
        create: function(options) {
            return ko.observable(options.data).extend({required: true});
        }
    }
}

var viewModel = ko.validatedObservable(ko.mapping.fromJS(data, validationMapping));

viewModel().showValidation = function()
{
    $$('.validationMessage').set('style', 'display:inline');
    return viewModel.isValid();
}
ko.applyBindings(viewModel);

演示:http://jsfiddle.net/bS62w/3/