Jquery validation in hidden 'div'

Question

I am new to Jquery. I am working in a form with 14 fields

First 7 fields are visible and next 7 are toggled on the basis of a button click in a div now in total there are 7 fields which are 'required'. 3 from first 7(visible part) and 4 from toggling div.

The problem is that when the toggling div is visible JQuery's validation plugin shows the required message if I miss any of the 7 fields but the same plugin just checks the validation of only 3 fields (which are in visible part of the form) when the div is hidden This is the normal condition .

how to make make the validation of full form even when the part of the form is hidden this is condition 2 Now if I delete the value of text box Address 1 and hides the Address Part and click SAVE it will not prompt for required thing for Address 1 even when I kept it 'required'

How are the inputs hidden? Are you sure the elements exist at all when they're hidden? — Mr Lister
– Mr Lister, Commented Apr 18, 2012 at 6:38

Chuck Norris · Accepted Answer · 2012-04-18 06:32:55Z

11

The possible reason can be that there is ignore: ':hidden' line in jquery.validate.unobtrusive.js file. Just remove that line.

After 1.9.0 version it was default behaviour. If the line doesn't exists in file(I'm not sure) you can fix that manually by adding

$.validator.setDefaults({ ignore: [] });

As you can see here

Another change should make the setup of forms with hidden elements easier, these are now ignored by default (option “ignore” has “:hidden” now as default). In theory, this could break an existing setup. In the unlikely case that it actually does, you can fix it by setting the ignore-option to “[]” (square brackets without the quotes).

answered Apr 18, 2012 at 6:32

Chuck Norris

15.2k15 gold badges96 silver badges128 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ankur Verma Over a year ago

Great it started working but how can I make visible the div that is hidden. I mean right now the form is not submitting because the value is not filled but the div is in hidden state.

Chuck Norris Over a year ago

You can programmatically show hidden div when validation error has thrown.

Collectives™ on Stack Overflow

Jquery validation in hidden 'div'

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related