knockout可观察数组验证的问题

时间:2013-04-05 08:53:46

标签: validation knockout.js ko.observablearray

我对observablearray元素的验证规则存在问题。我正在使用自定义消息模板来显示错误,问题是当错误出现时它不会显示,但是,我可以在相关字段中看到“*”。以下是我的模特:

function ViewModel(item) {
var parse = JSON.parse(item.d);
var self = this;
this.ID = ko.observable(parse.ID).extend({ required: { params: true, message: "ID is required" }});
this.Name = ko.observable(parse.Name);
this.WeeklyData = ko.observableArray([]);
var records = $.map(parse.WeeklyData, function (data) { return new Data(data) });
this.WeeklyData(records);
}

var Data = function (data) {
this.Val = ko.observable(data).extend({
    min: { params: 0, message: "Invalid Minimum Value" },
    max: { params: 168, message: "Invalid Maximum Value" }   
});

以下是我正在使用的验证配置:

    // enable validation
    ko.validation.configure({
    registerExtenders: true,
    messagesOnModified: false,
    insertMessages: true,
    parseInputAttributes: false,
    messageTemplate: "customMessageTemplate",
    grouping: { deep: true }
    });
    ko.validation.init();

任何我的自定义消息模板都是这样的:

   <script id="customMessageTemplate" type="text/html">
      <em class="errorMsg" data-bind='visible: !field.isValid()'>*</em>
   </script>

   <ul data-bind="foreach: Errors">
     <li class="errorMsg" data-bind="text: $data"></li>
   </ul>  

通过此实现,我在自定义模板中看不到验证消息。但是如果我删除配置deep:true,它不会验证可观察的数组元素,但是其他可观察的(ID)然后消息会正确显示。

我对此非常困惑并且有点卡住,所以如果有人可以提供帮助/

提前致谢。

2 个答案:

答案 0 :(得分:0)

我从您的问题中理解的是,您正在尝试验证您的observableArray条目,以便WeeklyData observableArray中的任何条目无法满足以下条件:

arrayEntry % 15 === 0

您想要显示错误消息。如果是这种情况,则以下自定义验证程序可以为您完成此任务:

var fminIncrements = function (valueArray) {
  var check = true;    
  ko.utils.arrayFirst(valueArray, function(value){
        if(parseInt(value, 10) % 15 !== 0)
        {
          check = false;
          return true;
        }
     }); 
  return check;
};

您必须在observableArray 上应用此验证器(无需对阵列的各个条目设置验证)。此验证器将数组作为输入并验证其每个条目,如果任何一个条目未通过验证,它将返回错误,并且您将看到错误消息。

您的viewmodel看起来像:

function viewModel() { 
    var self = this;

    self.WeeklyData = ko.observableArray([
      15, 
      40
    ]).extend({ 
        validation: {
          validator: fminIncrements,
          message: "use 15 min increments" 
        }
    });


    self.errors = ko.validation.group(self);
}

这是working fiddle

答案 1 :(得分:0)

单个项目没有显示消息 - 它只在摘要中 - 如何在单个文本框中指定消息?