jQuery Validator로 적어도 하나의 확인란을 선택하십시오.

Question

모두, 사용자가 양식을 제출하도록 허용하기 전에 jQuery 검사기로 적어도 하나의 확인란을 선택했는지 확인하려고합니다. 내 체크 박스에 다음과 같은 코드가있는 경우 : 다음

<input type="checkbox" value="23" class="select" name="vendor_categories[]">&nbsp;Test1<br /> 
<input type="checkbox" value="8" class="select" name="vendor_categories[]">&nbsp;Test2<br /> 
<input type="checkbox" value="9" class="select" name="vendor_categories[]">&nbsp;Test3<br /> 
<input type="checkbox" value="2" class="select" name="vendor_categories[]">&nbsp;Test4<br /> 

을 나는 다음과 같은 jQuery 코드가 있습니다

$("#register_vendor").validate({ 
    ignore: "", 
    rules: { 
     vendor_email: { 
      required: true, 
      email: true 
     }, 
     vendor_name: "required", 
     zip: { 
      required: true, 
      digits: true, 
      minlength: 5 
     } 
    }, 
    messages: { 
     vendor_email: { 
      required: "<br>Please enter an email address!<br><br>", 
      email: "<br>Please enter a valid email address!<br><br>" 
     }, 
     vendor_name: "<br>Please enter your vendor name!<br><br>", 
     zip: { 
      required: "<br>Please enter a zip code!<br><br>", 
      digits: "<br>You can only enter in numbers for the zipcode!<br><br>", 
      minlength: "<br>The zip code has to be atleast 5 digits!<br><br>" 
     } 
    }, 
    invalidHandler: function(e, validator) { 
     var errors = validator.numberOfInvalids(); 
     if (errors) { 
      var message = errors == 1 
       ? 'You missed 1 field. It has been highlighted below' 
       : 'You missed ' + errors + ' fields. They have been highlighted below'; 
      alert(message); 
     } 
     $('.togDesc').show(); 
    } 
}); 

내가

Answer 1

가에서 보이는 지정 유효성 검사 기능을 쓰기있어 얼마나 :

를

if(0 === $('input.select:checked').size()){ 
    // Error condition 
} 

... 결과가 잘못된 경우 발생합니다. 사이드 노트 : "select"라는 클래스가있는 체크 박스 입력을하는 것은 혼란 스럽습니다.

Answer 2

설명서를 읽은 후 '필수'속성에 대한 고유 한 콜백 처리기를 작성할 수있는 것 같습니다. 이것을 간단한 select 문과 결합하면 꽤 쉽게 (희망적으로) 만들 수 있습니다. 당신이 jQuery를 검사기를 사용하지 않은 경우

$("#register_vendor").validate({ 
    ignore: "", 
    rules: { 
     vendor_email: { 
      required: true, 
      email: true 
     }, 
     vendor_name: "required", 
     zip: { 
      required: true, 
      digits: true, 
      minlength: 5 
     }, 
     category_selected: { 
      required: function(elem) 
      { 
       return $("input.select:checked").length > 0; 
      } 
     } 
    }, 
    messages: { 
     vendor_email: { 
      required: "<br>Please enter an email address!<br><br>", 
      email: "<br>Please enter a valid email address!<br><br>" 
     }, 
     vendor_name: "<br>Please enter your vendor name!<br><br>", 
     zip: { 
      required: "<br>Please enter a zip code!<br><br>", 
      digits: "<br>You can only enter in numbers for the zipcode!<br><br>", 
      minlength: "<br>The zip code has to be atleast 5 digits!<br><br>" 
     } 
    }, 
    invalidHandler: function(e, validator) { 
     var errors = validator.numberOfInvalids(); 
     if (errors) { 
      var message = errors == 1 
       ? 'You missed 1 field. It has been highlighted below' 
       : 'You missed ' + errors + ' fields. They have been highlighted below'; 
      alert(message); 
     } 
     $('.togDesc').show(); 
    } 
});