jQuery Validation validating element even though set to “required: false”

but it is still validating and adding a class of “error-state” to the parent.

It’s “validating” because you have a field with a rule that needs to be evaluated every time it’s triggered. However, it is not “failing” validation.

In this case, it’s your own errorPlacement function that is adding the error-state class…

errorPlacement: function (error, $element) {
    ....

    if (inputType === 'checkbox') {
      $parentField.addClass('error-state');
      .....
    }
},

This is not what you’re supposed to do with errorPlacement. It’s only purpose is for placing the error message within your layout. It is not supposed to be used to add/remove any validation classes.

And since you have no code in place to remove this class, it’s going to stay there. Meanwhile, the validation plugin considers this field as “valid” despite the insertion of your custom class.

If you want to add/remove classes or do other things upon invalid/valid validation, you would use the highlight and unhighlight callback functions.


Quoting myself from an answer on one of your other questions:

“… you should not be using errorPlacement for adding classes. You should only use it for placing the message into your layout. …”


There is also no need to ever use required: false as that is the default. If you find yourself setting required to false, it means something else is wrong with your approach.

Not sure if there is a way to just force validation on this single element?

No idea what you’re really trying to achieve, but you can programmatically trigger validation on a field with the .valid() method.

$('#my_field').valid();

However, this only forces the plugin to evaluate the field, which will not fix your issue, because your custom errorPlacement function adds a validation class that the plugin is unable to remove.

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top