9

私は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();
    };
}

しかし、検証は機能していません。誰かが私がここで間違っていることを教えてもらえますか？

4

2 に答える 2

9

現在のアプローチにはいくつかの問題があります。

  1. 入力し忘れたko.validation.ruleはずですko.validation.rules
  2. ko.validation.registerExtenders();カスタムバリデーターを最初に使用する前に、カスタムルールの定義との呼び出しを行う必要があります。

  3. 検証が表示されるようにするには、バインディングを使用してどこかにバインドする必要があります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>

ここで試してみることができます：デモ。

于 2013-02-19T06:18:51.213 に答える
5

同等のネイティブバリデーターを使用することもできます。

self.Approve = ko.observable(false).extend({
    equal: { params: true, message: 'check must be ticked' }
  });
于 2015-10-13T13:19:28.067 に答える