2013-03-16 29 views
12

Tôi đang sử dụng jQuery Validation plugin để xác thực hộp kiểm vì nó không có tùy chọn mặc định, One nên được chọn và tối đa hai hộp kiểm có thể được chọn, đây là tiêu chí. Tôi không nhận được bất kỳ lỗi nào và nó không xác nhận. Tôi đang mở rộng nó như dưới đây,jQuery Validation plugin: xác thực hộp kiểm

<input type="checkbox" name="test[]" />x 
    <input type="checkbox" name="test[]" />y 
    <input type="checkbox" name="test[]" />z 
    $("#formid").validate({ 
    rules: { 
    test[]: { 

      required: function(elem) 
      { 
       return $("input.select:checked").length > 0; 
      } 

      }, 
messages: { 

    test[]: "You must check at least 1 box" 
    } 
}); 

Trả lời

36

Bạn có một số vấn đề với mã của mình.

1) Thiếu dấu ngoặc đóng, }, trong số rules.

2) Trong trường hợp này, không có lý do gì để sử dụng hàm cho quy tắc required. Theo mặc định, plugin có thể xử lý các đầu vào checkboxradio chỉ tốt, vì vậy việc sử dụng true là đủ. Tuy nhiên, điều này chỉ đơn giản là sẽ làm cùng một logic như trong chức năng ban đầu của bạn và xác minh rằng ít nhất một được kiểm tra.

3) Nếu bạn cũng chỉ muốn tối đa hai mục được chọn, thì bạn sẽ cần áp dụng quy tắc maxlength.

4) Tùy chọn messages thiếu thông số quy tắc. Nó sẽ hoạt động, nhưng một thông báo tùy chỉnh sẽ áp dụng cho tất cả các quy tắc trên cùng một trường.

5) Nếu thuộc tính name chứa ngoặc vuông, you must enclose it within quotes.

DEMO: http://jsfiddle.net/K6Wvk/

$(document).ready(function() { 

    $('#formid').validate({ // initialize the plugin 
     rules: { 
      'test[]': { 
       required: true, 
       maxlength: 2 
      } 
     }, 
     messages: { 
      'test[]': { 
       required: "You must check at least 1 box", 
       maxlength: "Check no more than {0} boxes" 
      } 
     } 
    }); 

}); 
1

Có một cách dễ dàng

HTML:

<input type="checkbox" name="test[]" />x 
<input type="checkbox" name="test[]" />y 
<input type="checkbox" name="test[]" />z 
<button type="button" id="submit">Submit</button> 

jQuery:

$("#submit").on("click",function(){ 
    if (($("input[name*='test']:checked").length)<=0) { 
     alert("You must check at least 1 box"); 
    } 
    return true; 
}); 

Vì điều này bạn không cần bất kỳ plugin nào. Thưởng thức;)

+5

Có thể ngắn hơn, nhưng @ram sử dụng plugin xác thực và plugin đó sử dụng các quy tắc để xác thực – Limon

+0

Điều đó đúng nhưng tôi đưa giải pháp này giống như không có thư viện bổ sung. –

+4

@ IvijanStefanStipić nhưng bạn đã sử dụng jquery ... –

Các vấn đề liên quan