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

使用jQuery Validator检查至少一个复选框

2 个答案: