Gravity Form loaded via AJAX not submitting

Question

I have a gravity form that is being loaded by an AJAX function. For some reason, when I try to submit the form I get a 400 error /wp-admin/admin-ajax.php#gf_3:1

Following guides online I added gravity_form_enqueue_scripts(3, true); to my header.php which has not solved the issue.

The form works fine in the preview page. I've tested multiple forms and multiple functions, however none of my forms will submit if they were loaded via AJAX.

Answer 1

I have the same issue and stumbled on your question here. I am loading different forms on the same page via ajax and I think I've found the solution.

You need to localize ajax.url

wp_localize_script( 'change-this-to-your-theme-handle', 'ajax', array(
    'url' => admin_url( 'admin-ajax.php' )
));

Looks like GF is looking for this if the form is loaded with ajax. I think they just assume that if you loaded GF with ajax that you are using ajax.url. Instead I was using my own object to localize stuff which is probably what you did too.

Answer 2

I spent many hours on this problem. I'm using Gravity Forms 2.5.1

It turns out that the `DOMContentLoaded' event that is loaded with the form was not being triggered.

In my function that calls the form, I manually triggered the event and now it works as expected.

    window.document.dispatchEvent(new Event("DOMContentLoaded", { bubbles: true, cancelable: true }));```