jQuery validation plugin on a form that's generated using ajax after page load

Question

How do I get the jQuery validation plugin to work on a form that's generated using ajax after the page loads? I have a from on my page that's returned from an ajax call, and the jquery validation plugin will not validate that form when I do like below. Any ideas on how to do this? When I submit the form, it submits the usual way, not using ajax

It's currently setup like this, where <form id="newRequest"> is generated after a user clicks a link on the page.

However, the plugin will not validate #newRequest

$("#newRequest").validate({
    rules: {

    },
    messages: {

    },

    submitHandler: function() {
    $.ajax({

    //etc

You need to call the plugin initialization after the form is created — Arun P Johny, Oct 17 '14 at 04:49
Put the call to `.validate()` in the `success:` function of the AJAX call. — Barmar, Oct 17 '14 at 04:50
@ArunPJohny How do I do that? I also did as Barmar suggested, but it still wont validate. — jmenezes, Oct 17 '14 at 05:52
Then you also need to show us the `ajax()` code that generates the form. — Sparky, Oct 17 '14 at 14:49

score -1 · Answer 1 · edited May 23 '17 at 12:05

-1

Dynamic elements are treated differently by the jQuery validation. You need to parse the form in validation flow like this,

$.validator.unobtrusive.parse("#newRequest");

This has been answered here as well.

Nicely tutorial.

edited May 23 '17 at 12:05

Community

1
1

answered Oct 17 '14 at 04:59

Rohit416

3,416
3
24
41

Where exactly does the OP say that he was using the unobtrusive validation plugin? – Sparky Oct 17 '14 at 14:48

jQuery validation plugin on a form that's generated using ajax after page load

1 Answers1