CODEWITHSUNDEEP
javascriptgravityforms
AKay
AKay

Reputation: 13

Gravity Forms Javascript Hook To Fire Script When User is on Specific Page on Multipage Form

I have a multi-page form created with gravity forms. It's form I use for lead generation, with the last step asking for the user's name, email, and phone number.

In the second last step before asking for user's personal info, there is a page with a "loading" gif spinner and the animated text "searching for a quote".

I need help to set up a javascript code for the second last page for when the user is on that page with the loading gif after 6.5 seconds it will automatically click the hidden page next button to take the user to the last page asking for their personal info.

I'm using the code below, which works only when the user manually clicks using the mouse or mousepad and click on the third last page. If the user enters details in the third last page and hits the enter or return key on the keyboard the code doesn't fire.

I'm not too familiar with Javascript. Just getting started learning.

I understand there's a gravity forms javascript gform_page_loaded, but that seems to fire the code on every single page rather than just when the second last page is in the user's viewport. Please help.

SEE CODE BELOW

<script type="text/javascript">

const btnSearchMortgage = document.getElementById("gform_next_button_13_16");

btnSearchMortgage.addEventListener("click", function () {

setTimeout(function () {

document.getElementById("gform_next_button_13_9").click();

}, 6500);

});
</script>

Upvotes: 1

Views: 2948

Answers (1)

Dave from Gravity Wiz
Dave from Gravity Wiz

Reputation: 2869

The gform_page_loaded is the way to go. You can use the currentPage parameter it passes to only trigger code on a given form page.

jQuery( document ).on( 'gform_page_loaded', function( event, formId, currentPage ) {
    if ( currentPage == 2 ) {
        // bind your custom event
    } 
} );

Upvotes: 2

Related Questions