JQuery Validation Plugin not working when used on page that includes another page via AJAX

Question

We have a long page that contains a bunch of different form elements. One part of the form is called remotely via AJAX and is populated in an empty div. This is the part which JQuery Validation plugin is not working correctly on.

We have class="required" on the elements on this page, but they do not show up as required. I'm guessing it's because the Validation plugin is looking for class="required" on our main page, and since the content from the AJAX page is put into the empty div behind the scenes, it's not detected the required fields.

Any help is greatly appreciated.

Answer 1

If you're applying $('form').validate() in $(document).ready(), perhaps instead you can try applying the validation in the success callback of your ajax div population routine.