Hi,
I have this code that has a bug in it:
<div class="mktoForm" id="promoForm" mktoName="Promotion Form"></div>
<!-- Marketo Form Event Handler Must stay here to load with form-->
<script>
MktoForms2.whenReady((form) => {
form.onSuccess((values, followUpUrl) => {
form.getFormElem().hide();
document.getElementById('promoConfirmFormDiv').style.display = 'block';
return false;
});
});
</script>
<div id="promoConfirmFormDiv" style="display:none;">
<p class="text-white"><strong>${promoFormConfirmation}</strong></p>
</div>
Solved! Go to Solution.
You have anotheronSuccess
function loading from GTM that’s redirecting in a DataLayer event callback (this always overrides an attempt to stay on the page).
Common problem as you must coordinate onSuccess
functions toward the same final outcome.
Please use the Syntax Highlighter (“Insert/Edit Code Sample”) when inserting code so it’s readable. I edited your post this time.
We need to see your actual page because this code alone is not causing the error.
Here is the link: https://empower.tylertech.com/test-gated-form-and-promo-form.html
Hi Sanford,
What is the best way to embed the GTM script if that's causing the issue? Commenting out the GTM script worked and now the form is working as intended, but I would like to have the GTM script as well.
Here is a new link:
https://empower.tylertech.com/test-gated-form-Ethan.html
Kind regards,
Ethan
I found out that we added an HTML script to our GTM container that listens to Marketo form submissions and when we removed this from the container the form functionality worked correctly and it isn't due to the actual GTM container.
Does anyone have any best practices to track form submissions?
Hi @SanfordWhiteman, how'd you find out about the double onSuccess functions?
how'd you find out about the double onSuccess functions?
Using the Debugger (in Developer Tools).
when we removed this from the container the form functionality worked correctly and it isn't due to the actual GTM container.
Of course, that's the conflicting onSuccess
function I referred to above.
Does anyone have any best practices to track form submissions?
Loading all your form behaviors from the same area – be that from a group of related GTM tags or a group of adjacent JS files in the same section of the LP HTML – is best practice. That’ll let you tightly coordinate the order and final outcome of your stack of onSuccess
, onValidate
, and onSubmit
listeners.