使用jQuery Validate插件确保选中三个复选框中的至少一个

Question

使用jQuery Validate插件,如何确保已选中三个复选框中的至少一个？到目前为止,我能做的最好的事情就是要使所有三个复选框都需要(这不是我想要的),而我的代码远远落在下面.

我尝试在jQuery Validate演示页面上使用此示例,但这需要每个复选框字段具有相同的名称.我无法做到这一点,因为这些字段是从CMS中提取的,每个字段都需要不同的名称.

我希望将此保留在jQuery validate中,因为我已经在这里验证了许多其他字段(为了保持这个示例清理而被剥离)并且这是我用有限的JS/jQuery知识验证表单的唯一方法.在此先感谢您的帮助.

这是我的HTML:

<form class="my_form" method="post" action="/" >

  <div><ul class="form_errors"></ul></div>

  <label><input class="my_checkbox_group" id="my_checkbox_1" name="my_checkbox_1[]" type="checkbox" value="Yes"> My checkbox 1</label>
  <label><input class="my_checkbox_group" id="my_checkbox_2" name="my_checkbox_2[]" type="checkbox" value="Yes"> My checkbox 2</label>
  <label><input class="my_checkbox_group" id="my_checkbox_3" name="my_checkbox_3[]" type="checkbox" value="Yes"> My checkbox 3</label>

  <input type="submit" value="Submit" />

</form>

这是我的JS:

$(".my_form").validate({
  errorLabelContainer: ".form_errors",
  wrapper: "li",
  rules: {
    'my_checkbox_1[]': { required: true },
    'my_checkbox_2[]': { required: true },
    'my_checkbox_3[]': { required: true }
  },
  messages: {
    'my_checkbox_1[]': "This field is required",
    'my_checkbox_2[]': "This field is required",
    'my_checkbox_3[]': "This field is required"
  }
});

Answer 1

使用require_from_group包含在规则的additional-methods.js文件.

rules: {
    'my_checkbox_1[]': {
        require_from_group: [1, ".my_checkbox_group"]
    }
}

• 第一个参数是要求的项目数.

• 第二个参数是class分配给分组中的所有元素.

• 还可以使用该groups选项将三条消息合并为一条.

新代码:

$(document).ready(function () {

    $(".my_form").validate({
        errorLabelContainer: ".form_errors",
        wrapper: "li",
        groups: {
            names: "my_checkbox_1[] my_checkbox_2[] my_checkbox_3[]"
        },
        rules: {
            'my_checkbox_1[]': {
                require_from_group: [1, ".my_checkbox_group"]
            },
            'my_checkbox_2[]': {
                require_from_group: [1, ".my_checkbox_group"]
            },
            'my_checkbox_3[]': {
                require_from_group: [1, ".my_checkbox_group"]
            }
        }
    });

});

工作演示:http: //jsfiddle.net/ya7Px/