jQuery Validate Plugin Checkbox Group Rules
I'm using the jQuery Validate plugin to require that at least one checkbox is checked in a group of checkboxes. Here's an example of the setup:
<input type="checkbox" name="test[name1]" id="testid1" class="required">
<input type="checkbox" name="test[name2]" 开发者_Go百科id="testid2" class="required">
And the JS:
$("#myform").validate({
groups: {
checkboxes: "test[name1] test[name2]"
}
}
I've been able to narrow down the problem to the fact that the inputs names have "[ ]" in them which I'm assuming is messing with the string parsing of the names. The platform I'm using however requires that I use brackets. This seems like it could be a common problem so maybe someone else has come across it and can help me out.
For reference, I've tried:
checkboxes: "testname1 testname2"
works but can't use it.
checkboxes: "'test[name1]' 'test[name2]'"
doesn't work.
The point of the name
attribute is to group related checkboxes/radio buttons together. So a group of checkboxes that act as a group should all have the same name
attributes (but each with unique id
attributes). Assuming you have this:
<input type="checkbox" name="test" id="testid1">
<input type="checkbox" name="test" id="testid2">
then the following JS will work:
$(formSelector).validate({
rules: {
test: "required"
},
messages:
test: "Please select an item"
}
});
Javascript checkbox group check without jQuery:
<script>
function checkboxGroup(frm) {
// set send to false first
bSend = false;
// array of all inputs in the form
aInputs = frm.getElementsByTagName("input");
// loop through the inputs array
for(i=0;i<aInputs.length; i++) {
if(
aInputs[i].getAttribute("type")=="checkbox"
&&
aInputs[i].getAttribute("name")=="test[]"
) {
// If one of the checkeboxes named test[]
// is checked, bSend will be set true
if(aInputs[i].checked) bSend = true;
}
}
// If none of the checkboxes named test[] are checked
// bSend will still be false hence not send the form
return bSend;
}
</script>
The HTML form I used for testing:
<form method="post" onsubmit="return checkboxGroup(this)">
<input type="checkbox" name="test[]" value="name 1">
<input type="checkbox" name="test[]" value="name 2">
<input type="checkbox" name="test[]" value="name 3">
<input type="checkbox" name="mom[]" value="name gg">
<input type="submit" value="test">
</form>
I'm going to guess that your platform is PHP based. PHP's shortcut of using [] to create arrays in the submitted form data is convenient up to a point, but those characters are illegal in id and name attributes.
I just had to do the same thing, and I found a simple answer buried at http://docs.jquery.com/Plugins/Validation/Methods/minlength#length
test: { minLength: 1 }
If your checkboxes all have identical name attributes ("test", not "test[x]").
精彩评论