Skip to main content
Eve_Yu
Level 2
Sep 11, 2023 3:44 AM UTC
Solved

Preventing page reload on form submission

I've embedded a Marketo form on our website with a 'Stay on Page' thank you page setting, but I've observed that after submitting the form, the page reloads. Is there a way to ensure that I remain on the form's location after submission and the page will not reload? Thanks!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
SanfordWhiteman
SanfordWhitemanAccepted solution
User Group Leader
Sep 11, 2023 4:02 AM UTC

“Stay On Page” is indeed somewhat of a misnomer. It would be better called “Reload Same Page” — but it unlikely to be changed after all this time!

 

To remain on the same page and not reload it, return false from a custom onSuccess function.

 

Then do whatever else you want instead of reloading.

MktoForms2.whenReady(function(readyForm){ readyForm.onSuccess(function(submittedValues,originalThankYouURL){ /* do whatever else you want to do here, just make sure to return false */ return false; }); });

 

As a very basic example, you can replace the entire form element with static HTML:

MktoForms2.whenReady(function(readyForm){ const formEl = readyForm.getFormElem()[0]; readyForm.onSuccess(function(submittedValues,originalThankYouURL){ /* do whatever else you want to do here, just make sure to return false */ formEl.innerHTML = "Thank you."; return false; }); });

 

The Forms 2.0 API is designed to let you add any custom behavior you want instead of reloading/redirecting.

6 replies

SanfordWhiteman
User Group Leader
SanfordWhitemanUser Group LeaderAccepted solution
User Group Leader
Sep 11, 2023 4:02 AM UTC

“Stay On Page” is indeed somewhat of a misnomer. It would be better called “Reload Same Page” — but it unlikely to be changed after all this time!

 

To remain on the same page and not reload it, return false from a custom onSuccess function.

 

Then do whatever else you want instead of reloading.

MktoForms2.whenReady(function(readyForm){ readyForm.onSuccess(function(submittedValues,originalThankYouURL){ /* do whatever else you want to do here, just make sure to return false */ return false; }); });

 

As a very basic example, you can replace the entire form element with static HTML:

MktoForms2.whenReady(function(readyForm){ const formEl = readyForm.getFormElem()[0]; readyForm.onSuccess(function(submittedValues,originalThankYouURL){ /* do whatever else you want to do here, just make sure to return false */ formEl.innerHTML = "Thank you."; return false; }); });

 

The Forms 2.0 API is designed to let you add any custom behavior you want instead of reloading/redirecting.

Translate
Eve_Yu
Eve_YuAuthor
Level 2
Sep 11, 2023 8:50 AM UTC

Thanks for your response. We tried this one, if the web page only embedded the Marketo form, it works. But if the web page has other codes, it doesn't work. Our website developer said that it was caused by Google Tag Manager. Do you have any ideas about it? 

Translate
Darshil_Shah1
Adobe Champion, Community Advisor, UG Leader
Adobe Champion, Community Advisor, UG Leader
Sep 11, 2023 12:01 PM UTC

This shouldn't be happening unless you have conflicting codes/other Marketo forms being loaded via the GTM. Are you able to share the page with GTM and form redirect to the thank you page script deployed?

Translate