Form confirmation message added to 1 form is preventing all other forms from redirecting as set

Highlighted

Form confirmation message added to 1 form is preventing all other forms from redirecting as set

Hello! Most we are using Webform CMS with embedded Marketo forms. Most of our forms are redirecting to confirmation landing pages--but for a specific form, we were hoping to show a confirmation message on the same page. We followed the instructions recommended from this product thread​ and were successful in getting the message to show up on our desired form. However we're noticing in testing that once this was enabled other forms that were not specifically defined to have this message are not redirecting to their appropriate confirmation landing pages.

Has anyone else ran into this issue?

This was added to our form on the page (with the #s set to our unique IDs):

<div class="container">

<script src="//app-ab##.marketo.com/js/forms2/js/forms2.min.js"></script>

<form id="mktoForm_####"></form>

<script>MktoForms2.loadForm("//app-ab##.marketo.com", "###-###-###", 1);</script>

<div id="confirmation" aria-hidden="true" style="display:none;">

<p>Thank you for registering! An email confirming all of the details is on its way!</p>

</div>

</div>

And this to the Javascript section of our site:

<script type="text/javascript">

MktoForms2.whenReady(function (form){

form.onSuccess(function(vals, page){

form.getFormElem().hide();

var confirm = document.getElementById('confirmation');

confirm.style.display = 'inline-block';

confirm.setAttribute('aria-hidden', false);

confirm.focus();

return false;

});

});

</script>

3 REPLIES 3
Highlighted

Re: Form confirmation message added to 1 form is preventing all other forms from redirecting as set

Well of course. You aren't checking the Form ID (form.getId()) before adding the onSuccess listener, so naturally it applies to all forms.

Highlighted
Level 2

Re: Form confirmation message added to 1 form is preventing all other forms from redirecting as set

HI Amanda,

Either you can use FORM ID condition on the onSucess event to make it run for a specific Form i.e

<script type="text/javascript">

MktoForms2.whenReady(function (form){

if(form.getId() == '####') {

form.onSuccess(function(vals, page){

form.getFormElem().hide();

var confirm = document.getElementById('confirmation');

confirm.style.display = 'inline-block';

confirm.setAttribute('aria-hidden', false);

confirm.focus();

return false;

});

}

});

</script>

Or for the Form on which you want to show a message do not add follow up URL(use "Stay on page") in the Marketo and add the following code:

<script type="text/javascript">

MktoForms2.whenReady(function (form){

form.onSuccess(function(vals, page){

if( page.includes(document.location.href)) {

form.getFormElem().hide();

var confirm = document.getElementById('confirmation');

confirm.style.display = 'inline-block';

confirm.setAttribute('aria-hidden', false);

confirm.focus();

return false;

}

});

});

</script>

I hope this help you.

Best Regards,

Avtar Singh

Highlighted

Re: Form confirmation message added to 1 form is preventing all other forms from redirecting as set

String.prototype.includes can't be used until IE disappears (i.e. never). Use indexOf.

But the concept is broken from the start because you can't use primitive string-in-string matching here. You're forgetting about UTMs, aliID, and the many other ways that the current URL can differ from the Thank You URL, yet still represent the same page at the business level. You must compare only the protocol, host, and path of both URLs.