I have a set of 4 checkboxes, all with different names, and require that at least 1 is checked.
I have set the class on all of them to 'require-one'.
<html>
<head>
<script src="scripts/lib/jquery.js" type="text/javascript"></script>
<script src="scripts/jquery.validate.js" type="text/javascript"></script>
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
$("#itemForm").validate({
rules: {
check1: {
required : {
depends: function(element) {
$('.require-one:checked').size() == 0;
}
}
}
}
});
});
</script>
</head>
<body>
<form name="itemForm" id="itemForm" method="post">
<input type="checkbox" name="check1" id="check1" class="require-one" value="1" />
<input type="checkbox" name="check2" id="check2" class="require-one" value="2" />
<input type="text" class="required" />
<input type="submit" />
</form>
</body>
</html>
If you put in 'return' before the $('.require-one:checked').size() == 0; However, now my problem is the error message will only disappear if Checkbox #1 is selected. If Checkbox #2 is selected it will not disappear, but will submit. How do I remove the error if any of the checkboxes are checked?
rules: {
'nameOfAnyCheckbox': {
required : {
depends: function(element) {
return $('.require-one:checked').size() == 0;
}
}
}