Xác thực jQuery của nhiều đầu vào không bằng nhau

Question

Tôi đã quản lý để thiết lập plugin xác thực jQuery trên biểu mẫu của tôi và tôi đã đưa ra các quy tắc cho hai trường mà giá trị của chúng không khớp. Cụ thể, các đầu vào email và email_2 không thể giống nhau ngay bây giờ và nó hoạt động. Nhưng nhu cầu thực sự của tôi là xác nhận nhiều đầu vào theo cùng một cách (trong trường hợp này là 4 trong số đó). Tôi có email, email_2, email_3, email_4 và không ai trong số họ không được bình đẳng. Bạn có thể nhìn thấy nó trong jsfiddle here của tôi, và nếu bạn có giải pháp, bạn có thể cập nhật nó và đưa nó trở lại trong câu trả lời:

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 
    }, 
}, 
}); 

là những gì giải pháp tốt nhất để xác nhận tất cả các yếu tố đầu vào?

Answer 1

Vâng, nó vẫn hoạt động với 1.10.1

DEMO

nguồn: 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'] 
     }, 
    }, 
}); 

Answer 2

Bạn có thể sử dụng $ .unique():

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

Answer 3

uniqArray = emailsArray.slice(); 

$.unique(uniqArray); 

if (uniqArray.length != emailsArray.length) { 
    <your magic here> 
}