2013-06-06 13 views
5

フォームにjQuery検証プラグインを設定できましたが、値が一致しない2つのフィールドに対してルールを指定しました。具体的には、emailとemail_2の入力を同じにすることはできません。しかし、私の本当の必要性は、同じ方法(この場合は4つ)で複数の入力を検証することです。私は電子メール、email_2、email_3、email_4を持っていて、どれも平等ではないはずです。あなたは私のjsfiddle hereでそれを見ることができ、あなたが解決策を持っている場合、あなたはそれを更新し、答えに戻ってそれを置くことができます。複数の等しくない入力のjQuery検証

HTML:

<form id="signupform" method="post"> 
<input id="email" name="username" /> 
<br/ > 
<input id="email_2" name="email_2" /> 
<br /> 
<input id="email_3" name="email_3" /> 
<br /> 
<input id="email_4" name="email_4" /> 
<br /> 
<input id="submit" type="submit" value="submit" /> 
</form> 

jqueryの:

が何であるかを
$.validator.addMethod("notequal", function(value, element) { 
return $('#email').val() != $('#email_2').val()}, 
"* You've entered this one already"); 

// validate form  
$("#signupform").validate({ 

rules: { 
    email: { 
     required: true, 
     notequal: true 
    }, 
    email_2: { 
     required: true, 
     notequal: true 
    }, 
}, 
}); 

すべての入力の検証に最適なソリューションですか?

+1

チェックこのアウト:http://www.anujgakhar.com/2010/05/24/jquery-validator-plugin-and-notequalto-rule-with-multiple-fields/ – kei

+0

ありがとうございますが、このようにしてjQueryライブラリにエラーが発生しましたが、これは最新の1.10.1では動作しないようです... – dzordz

答えて

9

はい、それはまだ1.10.1

DEMO

源で動作します:http://www.anujgakhar.com/2010/05/24/jquery-validator-plugin-and-notequalto-rule-with-multiple-fields/

HTML

<form id="signupform" method="post"> 
    <p> 
     <input class="distinctemails" id="email" name="username" /></p> 
    <p> 
     <input class="distinctemails" id="email_2" name="email_2" /></p> 
    <p> 
     <input class="distinctemails" id="email_3" name="email_3" /></p> 
    <p> 
     <input class="distinctemails" id="email_4" name="email_4" /></p> 
    <p> 
     <input id="submit" type="submit" value="submit" /> 
    </p> 
</form> 

jQueryの

jQuery.validator.addMethod("notEqualToGroup", function (value, element, options) { 
    // get all the elements passed here with the same class 
    var elems = $(element).parents('form').find(options[0]); 
    // the value of the current element 
    var valueToCompare = value; 
    // count 
    var matchesFound = 0; 
    // loop each element and compare its value with the current value 
    // and increase the count every time we find one 
    jQuery.each(elems, function() { 
     thisVal = $(this).val(); 
     if (thisVal == valueToCompare) { 
      matchesFound++; 
     } 
    }); 
    // count should be either 0 or 1 max 
    if (this.optional(element) || matchesFound <= 1) { 
     //elems.removeClass('error'); 
     return true; 
    } else { 
     //elems.addClass('error'); 
    } 
}, jQuery.format("Please enter a Unique Value.")) 

// validate form  
$("#signupform").validate({ 

    rules: { 
     email: { 
      required: true, 
      notEqualToGroup: ['.distinctemails'] 
     }, 
     email_2: { 
      required: true, 
      notEqualToGroup: ['.distinctemails'] 
     }, 
     email_3: { 
      required: true, 
      notEqualToGroup: ['.distinctemails'] 
     }, 
     email_4: { 
      required: true, 
      notEqualToGroup: ['.distinctemails'] 
     }, 
    }, 
}); 
+0

ありがとう、魅力的な作品!私は他のどこかでエラーを逃したと思う。私はそれはコンソールが私にライブラリエラーを与えたときにはサポートされていないが – dzordz

1

あなたは$ .unique()を使用することができます。

uniqArray = $.unique(emailsArray); 
if (uniqArray.length != emailsArray.length) { 
    <your magic here> 
} 
+0

最後にどうしたらいいか分かりません、私はjquery noobyです。あなたは私のjsfiddleで私を見せてくれますか? http://jsfiddle.net/zPetY/お願いしますか? – dzordz

+0

ここに行く:http://jsfiddle.net/zPetY/1/ – mishik

+1

ケイのソリューションは、はるかに優れています。私は "validator"がそのような機能を持っていることを知らなかった – mishik

0
uniqArray = emailsArray.slice(); 

$.unique(uniqArray); 

if (uniqArray.length != emailsArray.length) { 
    <your magic here> 
} 
関連する問題