驗證至少有一個複選框使用jQuery驗證器進行檢查

Question

全部， 我試圖確保在允許用戶提交表單之前，我的至少一個複選框是使用jQuery Validator進行檢查的。如果我有我的選擇框下面的代碼：

<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

閱讀文檔後，您可以爲'required'屬性編寫自己的回調處理程序。將它與簡單的select語句結合起來，使其變得非常容易（希望）。我無法對此進行測試，但給這個一展身手：

$("#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(); 
    } 
});