jQuery-validate - addMethod - 2つのテキストボックスを参照するカスタムルールの適用方法?

私は jQueryバリデーションプラグインを使用しています。カスタムを使用したいこのメソッドは、2つの異なるテキストボックスに入力された値を考慮して、状況が有効かどうかを判断します。

私はメソッドを追加して、例を見つけました。

jQuery.validator.addMethod("math", function(value, element, params) { 
 return this.optional(element) || value == params[0] + params[1]; 
}, jQuery.format("Please enter the correct value for {0} + {1}"));

... 2つの要素を参照していますが、このようなメソッドを使用するルールを作成する方法は明確ではありませんか?

議論しやすくするために、私はこのサンプルメソッドを使いたいと思っています。このようなフォームがあります。

<form id="TOTALSFORM" name="TOTALSFORM">
    
    
<input type="text" name="LHSOPERAND" id="LHSOPERAND" class="required" />

<input type="text" name="RHSOPERAND" id="RHSOPERAND" class="required" />
<input type="text" name="TOTAL" id="TOTAL" class="required" /> </form>

私はこのように適用する他のルールがあります:

$("#OPTREASON").rules("add", {
    required: true,
    min: 0,
    messages: {
        required: "Required input",
        min: "Please select a Reason"
    }
});

「TOTAL」が「LHSOPERAND」と「RHSOPERAND」の合計としてチェックされるように、例のカスタムメソッドを適用するために同様のことを行うにはどうすればよいですか。

17

1 答え

以下を試してください:

ルールを作成する

jQuery.validator.addMethod("checkTotal",function(value) {
    total = parseFloat($('#LHSOPERAND').val()) + parseFloat($('#RHSOPERAND').val());
    return total == parseFloat($('#TOTAL').val());
}, "Amounts do not add up!");

jQuery.validator.classRuleSettings.checkTotal = { checkTotal: true };

入力

<input type="text" name="TOTAL" id="TOTAL" class="required checkTotal" />

初期検証

$(document).ready(function() {
    $("#TOTALSFORM").validate();
});

Fiddle here: http://jsfiddle.net/wTMv3/

36
追加された
もし私が2つのそのようなメソッドを同時に追加したいのであれば?
追加された 著者 partho,
ちょうど私が欲しいもの。どうもありがとう。
追加された 著者 shearichard,
このような完全な答えをありがとう。もう少し完了するだけです: jQuery.validator.classRuleSettings.className = {methodName:true};
追加された 著者 Fernando,