jQuery Validation plugin - Validating hidden inputs and not visible?
JqueryJquery ValidateJquery Problem Overview
How would I validate hidden inputs and not visible text inputs with jQuery Form Validation plugin? The problem is, that I'm using auto-suggest plugin, which generates a hidden input for selected items:
<input id="hiddenInput" type="hidden" name="something" value="1" />
I have 2 inputs like this (both of them only allow 1 item), which I want to validate and display the error in parent <td>
.
This is what I've gotten so far, but it doesn't display the error or submit a form, if the value is actually a number.
$("#form1").validate({
rules: {
something: {
number:true,
min:1,
required:true
}
}
})
Jquery Solutions
Solution 1 - Jquery
To allow validation of hidden elements, override the ignore and set it to empty string:
$("#form1").validate({
ignore: "",
rules: {
something: {
number:true,
min:1,
required:true
}
}
});
Solution 2 - Jquery
You can use ignore
option like this:
$("#form1").validate({
ignore: "input[type='text']:hidden",
rules: {
something: {
number:true,
min:1,
required:true
}
}
});
Default value of ignore
option is :hidden
which ignores all hidden fields and non-visible fields (display: none
etc.)
Solution 3 - Jquery
If the other answers aren't working for you, try this instead. It removes all ignores for the form, so it would validate everything including hidden fields:
$.data($('form')[0], 'validator').settings.ignore = "";
To restore the settings to ignore hidden fields, use something like this:
$.data($('form')[0], 'validator').settings.ignore = "input[type='text']:hidden";
You can also use the above code to read back the current value.
Solution 4 - Jquery
Another way to validate hidden inputs is this:
$("#form1").validate({
ignore: "not:hidden",
rules: {
something: {
number:true,
min:1,
required:true
}
}
});