Michael
Michael

Reputation: 2284

jQuery Validate - Remove Error Class from Parent Div

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

Answers (2)

Rob W
Rob W

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

Fatih Donmez
Fatih Donmez

Reputation: 4347

You can do it in checkbox change event.

$("yourdiv").removeClass("checkbox-error");

Upvotes: 2

Related Questions