10

私はデュランダルを使用しています。デュランダルは、ノックアウトを活用しています。

検証の長さを動的に変更できるようにしたい

ここに画像の説明を入力

フィドル

フィドルは私の「動作中の」ソリューションとは少し異なる動作をしているようですが、それでも私が望んでいること/期待していることをしていません。

ビューモデル JS:

【試み1】

define(function () {

   var self = this;

   self.userInfo = {       
        IdOrPassportNumber: ko.observable().extend({
            required: true,
            pattern: {
                message: 'A message',
                params: /some regex/
            }
        }),
        IdType: ko.observable()
    },

    self.isIdValid = ko.validatedObservable({ 
         IdOrPassportNumber: self.userInfo.IdOrPassportNumber 
    });

    self.userInfo.IdOrPassportNumber.subscribe(function (value) {
          if (isIdValid.isValid()) {
               console.log('YOLO!');
          }
    });

    self.userInfo.IdType.subscribe(function (value) {
        console.log(value);
        if (value === 'Passport') {
            self.userInfo.IdOrPassportNumber.extend({ maxLength: 15 });
        } else {
            self.userInfo.IdOrPassportNumber.extend({ maxLength: 13 });
        }
    });    

    var viewModel = {
        userInfo: self.userInfo
    };

    viewModel["errors"] = ko.validation.group(viewModel.userInfo);
    viewModel["errors"].showAllMessages();

    return viewModel;
});

起こっているように見えるのは、入力を開始すると最大と最小の検証が13になるが、入力を続けると検証が15に変わるということです。別のルートを試し、最初の観測可能な拡張で最小と最大の長さを設定しましたEG、正規表現の直後に、オブザーバブルを使用するように最小長と最大長を設定すると、成功しません。

【試み2】

   self.userInfo = {       
       IdOrPassportNumber: ko.observable().extend({               
            maxLength: self.maxLength(), 
            minlength: self.maxLength()
       }),
       IdType: ko.observable()
   },

   self.maxLength = ko.observable();

   self.userInfo.IdType.subscribe(function (value) {

          if (value === 'Passport') {
             self.maxLength(15)
          } else {
              self.maxLength(3)
          }
    });
4

3 に答える 3

5

あなたはとても近かったです:-)アンラップされた値ではなく、オブザーバブル自体を提供する必要があります。()fromを削除するだけでmaxLength()、検証ライブラリが自動的にラップを解除します。

self.userInfo = {       
   IdOrPassportNumber: ko.observable().extend({               
        maxLength: self.maxLength, 
        minlength: self.maxLength
   }),
   IdType: ko.observable()
},

動的正規表現パターンを使用した別の例を次に示します。

    zipPostalPattern = ko.pureComputed(() => this.countryCode() === 'US' ? '^\\d{5}(?:[-\\s]\\d{4})?$' : '');
    zipOrPostal: KnockoutObservable<string> = ko.observable('').extend(
    {
        required: true,
        pattern: {
            message: 'This is not a valid postcode for the country',
            params: this.zipPostalPattern
        }
    });

または（メッセージが必要ない場合）。

    zipPostalPattern = ko.pureComputed(function() { return this.countryCode() === 'US' ? '^\\d{5}(?:[-\\s]\\d{4})?$' : ''});
    zipOrPostal: KnockoutObservable<string> = ko.observable('').extend(
    {
        required: true,
        pattern:  self.zipPostalPattern
    });

重要: カスタム メッセージが必要ない場合は、messageパラメーターを削除してそのままpattern = { params: this.zipPostalPattern }にしないでください。機能しないためです。メッセージがない場合は、正規表現/文字列をpatternパラメーターに直接設定する必要があります。

countryCode()または、もちろん、計算されたオブザーバブルをその場で定義することもできます（ここでは、関数として呼び出しても問題ありません。それが計算された動作の方法だからです）

    zipOrPostal: KnockoutObservable<string> = ko.observable('').extend(
    {
        required: true,
        pattern:  ko.pureComputed(function() { 
                     return self.countryCode() === 'US' ? '^\\d{5}(?:[-\\s]\\d{4})?$' : ''
                  })
    });
于 2015-06-01T21:26:36.507 に答える
4

このことを考慮

self.iDNumber = ko.observable('').extend({
        required: {
            params: true,
            message: 'ID Number is a required field.',
            insertMessages: false
        },
        SouthAfricanIDNumber: {
            message: 'Please enter a valid South African ID number.',
            onlyIf: function() {
                return self.identityType() === 'SAID';
            }
        }
    });

SouthAfricanIDNumber は、正規表現を使用するカスタム検証です。

于 2014-01-22T09:37:27.177 に答える