jquery validator plugin with display:none form elements
Solution 1
From the 1.9.0 Change Log of jQuery Validate:
- Fixed #189 - :hidden elements are now ignored by default
To turn it back on simply do the following:
$(document).ready(function(){
$.validator.setDefaults({
ignore: []
});
});
Make sure that this appears before you call the actual validation plugin in your code.
I hope this helps!
Solution 2
I like the answer of @dSquared but unfortunately 'ignore'-property will be reseted for every form's validator on page. In some cases it doesnt need.
I use this way:
$(document).ready(function () {
var $form = $("#some-form");
$form.validate().settings.ignore = []; // ! Say to validator dont ignore hidden-elements on concrete form.
$('#button-send').click(function () {
if ($form.valid()) { .. }
});
// !! apply plugin's initializers which will hide origin elements (it can be CLEditor or Choosen plugins)
});
Solution 3
Have you tried adding the style attribute to the input element? So instead of wrapping it with a div, try:
<input type="text" name="test" value="" style="display: none;" />
Related videos on Youtube
Admin
Updated on October 27, 2020Comments
-
Admin over 3 years
I'm using the validator plugin found here to validate a form.
Problem I'm having is if I put the following around a form input element the validation fails:
<div style="display:none;"><input type="text" name="test" /></div>
I need this because I'm using other UI control layers for the input elements and don't want them visible.
It works on inline and block elements, but I need it to be hidden. Is there anyway to get around this?
Thanks for any feedback
Update:
I'm mostly validating select option fields, with django (ie: {{form.select_option_element}} )
So effectively:
<div style="display:none;"> {{form.select_option_element}} </div>
...doesn't work
Right after posting I seem to solve it with:
<div style="visibility: hidden; height: 0;"> {{form.select_option_element}} </div>
It then allows me to validate the field.
-
dSquared over 11 yearsPlease don't place the accepted answer within your question. Questions and answers should be kept separate.
-
Admin over 11 yearsno problem, not used to the place yet
-
Fabio Antunes about 10 yearspossible duplicate of jQuery Validate - Enable validation for hidden fields
-
-
Admin over 11 yearsNevermind, blanked out for a minute. Here is how I solved it: <div style="visibility: hidden; height: 0;"> <input type="text" name="test" /> </div>
-
Admin over 11 yearsI'm using django ModelForms, I forgot to mention I mostly validating select option list.
-
Admin over 11 yearsWhat I mean is that the validator doesn't even recognize the field, not the validation process itself.
-
prakashpoudel over 11 yearsWell I saw the way you fixed it. Anyway good to see u got the solution.
-
Admin over 11 yearsah, thank you. That works quite nicely. I will use this instead.
-
dSquared over 11 years@lcplusplus No problem; glad I could help.
-
Lafi about 10 yearsWhy an empty array, not an empty string?