Reputation: 2284
I have a set of checkboxes, that when none are selected, a class is added to the parent div to make the text red. However, when a box is selected, the class should be removed. With my current code, the class remains attached to the div when a checkbox is selected.
How do I remove the class once a single checkbox is selected?
$().ready(function() {
$('#addForm').validate({
rules: {
"items": {
required: true,
minlength: 1
}
},
errorPlacement: function(error, element) {
if (element.is(':checkbox')) {
$(element).parent("div").addClass('checkbox-error');
}
else {
return true;
}
}
});
});
Upvotes: 0
Views: 1091
Reputation: 348972
Bind an event listener to the checkbox, which removes the class once it's checked:
$("#addForm :checkbox").change(function(){
if(this.checked) {
$(this).parent("div").removeClass("checkbox-error");
}
})
Upvotes: 3
Reputation: 4347
You can do it in checkbox change event.
$("yourdiv").removeClass("checkbox-error");
Upvotes: 2