2

我正在使用带有 alt-checkbox ( http://alt-checkbox.starikovs.com/ ) 的 jquery 1.9.1 来创建一组“不错”的复选框。我还想确保至少选择了一个复选框，因此我正在使用 jQuery Validation 插件。验证在没有 alt-checkbox 样式的情况下工作正常，但是当我添加样式时验证失败。

复选框的（精简）原始代码是：

<form id="form" name ="form">
  <input type="checkbox" name="groups[]" class="checkbox" value="1">
  <input type="checkbox" name="groups[]" class="checkbox" value="2">
</form>

alt-checkbox 样式是通过以下方式添加的：

<script>
  jQuery(".checkbox").altCheckbox({
  });
</script>

验证通过以下方式完成：

$("#form").validate({

    rules: {              
        'groups[]': {
          required: true,
        }
      },

      messages: {
        'groups[]': "Please select at least one group"    
      }         
});
 });
</script>

alt 复选框呈现：

<a href="#" class="alt-checkbox fontawesome-ok medium outline-unchecked"/>
<input type="checkbox" name="groups[]" id="groups[]" class="checkbox" value="1" style="display: none;"/>
<a href="#" class="alt-checkbox fontawesome-ok medium outline-unchecked checked"/>
<input type="checkbox" name="groups[]" id="groups[]" class="checkbox" value="2" style="display: none;"/>

我已经尝试了各种方法来使其正常工作，包括将 validate="required:true, minlength:2" 添加到第一个复选框但没有运气。有什么建议么？

4

1 回答 1

1

您需要做的就是允许 jQuery Validate 在隐藏元素上执行。它仍然适用于您的替代复选框实现：

$("#form").validate({
    ignore:'',//by default it ignores hidden inputs, so setting this to blank overrides that
    rules: {              
        'groups[]': {
          required: true,
        }
      },

      messages: {
        'groups[]': "Please select at least one group"    
      }         
});
于 2013-05-30T15:53:16.703 回答