I've a form which uses jQuery UI based tab to organize different fields. I'm using jquery.validate.min.js for validation. For example some fields have class = "required" which informs the plugin for required field validation. Finally, before form submit I validate the form to ensure all inputs are correct. A simple usage like -
HTML
...
<input type="text" class = "required" ...
SCRIPT
...
$("#frmClaim").validate();//to initilize validation
...
$('#frmClaim').submit(function () {
if($(this).valid())
{ ... }
});
...
The issue I'm facing is that if I'm on tab 3 and there's a "required" field on tab 2 which the user has not populated, the validation is NOT performed. The validation triggers only for the fields which are visible - that is the active. Is this possible or am I missing something?
For now, on submit I manually activate each tab, perform .valid and proceed. Is there a better work around?
Initialize validation like this to validate your hidden fields
$("#frmClaim").validate(
{ ignore: [] }
);