8

私は現在、bassistance jquery validationまたは jqueryvalidation プラグイン (名前を変更しました) を使用しており、次のようなフォームを検証しています。

if($.fn.validate) {
        $("#frmNewOrder").validate({
            rules: {
                txtAmount: {
                    required: true,
                    digits: true
                },
                ddlAccount: {
                    required: true
                },
                ddlBank: {
                    required: true
                }
            }
        });
    }

必要な量に応じて、余分なフィールドが必要かどうかに応じてドロップダウンリストが表示され、そのドロップダウンリストに応じて別のテキスト入力が行われます。次のようになります。

 if($('#txtAmount').val() >= 10000){
     //add ddlReason required
 }

 if($('#ddlReason').val() == 'o'){
     //add txtReason required
 }

他のフィールドと同様に「必須」の css クラスを追加しようとしましたが、それらがルール内にない場合は機能しませんか? 私は次のようなルールを追加しようとしました：

 $( "#ddlReason" ).rules( "add", {
        required: true});

それもうまくいきません。助言がありますか？

編集:これは、私が使用している jquery 検証へのリンクです。外部でルールを使用すると、次のエラーが発生します。

Uncaught TypeError: Cannot read property 'settings' of undefined

124行目：

var settings = $.data(element.form, 'validator').settings;

他の場所で見た提案を使用して、これを行ったことがエラーの原因です:

var defaultrules = {
    txtAmount: {
        required: true,
        digits: true
    }
}

if($.fn.validate) {
    $("#frmNewOrder").validate();
    addRules(defaultrules);
}

編集 2: これが html マークアップです。

<form id="frmNewOrder" name="frmNewOrder" action="" method="post">
<label>Amount</label>
<input type="text" name="txtAmount" id="txtAmount" class="required" />
<button id="calculate" type="button">Calculate</button>
<div id="dvreason" style="display:none;">
    <select id="ddlReason" name="ddlReason">
         <option></option>
         <option value="i">Option 1</option>
         <option value="o">Other</option>
    </select>
    <div id="dvother" style="display:none">
       <label>Other reason</label>
       <input type="text" name="txtOther" id="txtOther" />
    </div>
</div>
<input type="submit" name="send" id="send" value="Send" />
</form>
4

3 に答える 3

5

それと同様の問題に直面し、

実際、124 行目でバリデーターが定義されていないことに気付くでしょう。つまり、フォームに関連付けられたバリデーターのインスタンスはありません。

検証メソッドをチェックすると、バリデーターが未定義の場合、新しいものが作成されることがわかります

var validator = $.data(this[0], 'validator');
        if ( validator ) {
            return validator;
        }

        // Add novalidate tag if HTML5.
        this.attr('novalidate', 'novalidate');

            //HERE it is creating a new one using the constructor   
        validator = new $.validator( options, this[0] );
        $.data(this[0], 'validator', validator);

どうやらrulesメソッドは、バリデーターがフォームオブジェクトに既に存在すると想定しているため、私の理解では、validateバリデーターインスタンスを返すので、呼び出しvalidateて、返されたバリデーターオブジェクトに追加のルールを追加し、settings.rules再実行できますが、これはあまり実用的ではありません。

他の解決策は、呼び出す前に、追加されたルールを最初のルール オブジェクトに単純に追加することです。validate

したがって、私の場合、入力フィールドを数値として検証したかったのですが、Google Chrome で数値フィールドにしたくありませんでした (Chrome で試してみて、意味を確認してください。これには、型数値の検証をバイパスするという問題がありましたユーザーが手動で入力した場合、私の場合、ユーザーはおそらく手動で番号を入力します）

コード例:

var customRule = {number: true};

//suppose populateValidateRules() fills your initial rules, which is my case at least
var validationRules =  populateValidateRules();

validationRules["rules"].fieldToBeDynamicallyModifiedForValidation= customRule;

$(formId).validate(validationRules);

お役に立てれば

于 2013-10-22T21:08:26.240 に答える
0

IDを使用して動的追加要素を取得する際に問題が発生するため、属性セレクターを使用すると機能します。たとえば、属性data="ddlReason"を追加して次のようにします。

$( "input[data='ddlReason']" ).rules( "add", {
        required: true
});
于 2014-10-10T07:32:52.737 に答える