Question

我正在使用knockout.js和knockout.validation插件。我正在尝试验证复选框，如果选中它的有效则无效。为此我在淘汰赛中创建了一个自定义的valdation属性：

ko.validation.rule['checked'] = {
    validator: function (value) {
        if (!value) {
            return false;
        }
        return true;
    }
};

我的观点模型是：

function VM()
{
    var self = this;
    self.Approve = ko.observable(false).extend({
        checked: { message: 'Approval required' }
    });
    self.Errors = ko.validation.group(self);
    self.Validate = function(){
        if(self.Errors().length > 0)
        self.Errors.showAllMessages();
    };
}

但验证无效。谁能告诉我这里我做错了什么？

Answer 1

您当前的方法存在一些问题：

您错过了ko.validation.rule应该是ko.validation.rules
首次尝试使用自定义验证程序之前，应先完成自定义规则定义和ko.validation.registerExtenders();的调用。
为了显示验证，您需要使用validationMessage绑定将其绑定到某处：
```
<span data-bind='validationMessage: Approve'></span>
```

所以固定脚本：

ko.validation.rules['checked'] = {
    validator: function (value) {
      console.log(value);
        if (!value) {
            return false;
        }
        return true;
    }
};

ko.validation.registerExtenders();

function VM()
{
  var self = this;  
  self.Approve = ko.observable(false).extend({
    checked: { message: 'Approval required' }
  });

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

  self.Validate = function(){    
     if(self.Errors().length > 0)
       self.Errors.showAllMessages();
  };
}

ko.applyBindings(new VM());

HTML：

<input type="checkbox" data-bind="checked: Approve" />  
<span data-bind='validationMessage: Approve'></span>
<button type="button" data-bind="click: Validate">Submit</button>

您可以在此处试用：Demo。

Answer 2

您也可以使用相同的原生验证器：

x,y

如何验证淘汰赛中的复选框

2 个答案: