使用jquery validate插件进行多字段验证

时间:2013-01-29 06:08:07

标签: jquery jquery-validate

我有两个输入复选框,如下所示:

<input type="checkbox" value="1" name="items[test1]" id="items_test1">
<input type="checkbox" value="1" name="items[test2]" id="items_test2">

我想要至少检查其中一个。 为此,我添加了jquery validate插件代码,如下所示:

 $.validator.addMethod("checkTest", function(value) {
    return false; // return false just to check whether it triggers error
}, 'Please check atleast one');

 $(document).ready(function() {
     $("form").validate({
         groups: {
            checkTest: 'items[test1] items[test2]'
         },
         errorPlacement: function(error, element) {
              console.log(error);
     });
 });

这项检查被触发了。我做错了什么?

2 个答案:

答案 0 :(得分:0)

我知道你想使用验证插件来做这件事,但是如果你想手动去,那么你可以使用这种方法。

<强> HTML

<form>
    Checkbox 1: <input type="checkbox" value="1" name="items[test1]" id="items_test1">
    <br>
    Checkbox 2: <input type="checkbox" value="1" name="items[test2]" id="items_test2">

    <br>
    <input type='submit' value='Submit' />
</form>

<强> JS

$(document).ready(function() {
    $(document).on('submit', 'form', function() {
        if($('#items_test1').is(':checked') || $('#items_test2').is(':checked')) {
             alert('done. valid form submission.');   
        } else {
             alert('invalid form submission, check atleast one checkbox.');   
        }
        return false; 
    });
})

您可以在jsfiddle here上找到。

答案 1 :(得分:0)

您已设置了该组,但尚未在复选框中添加任何验证规则。我会使用插件的其他方法文件中的require_from_group方法。在文件准备中:

// add a class to the checkboxes in the group, here I have added to all
$('[type=checkbox]').addClass('test_checkboxes');

// set up a rule for the class
$.validator.addClassRules("test_checkboxes", {
    require_from_group: [1, ".test_checkboxes"]
});

$("form").validate({
    groups: {
        checkTest: 'items[test1] items[test2]'
    }
});

fiddle here

相关问题