Re: Auto Submit Marketo Form on Page Load

Derek_Vansant4 · ‎12-14-2015

I have a use case where I want a marketo form to pre-populate fields based on url parameters and then automatically be submitted on page load without any user clicks. I would have thought the code below would work, but it doesn't. Instead, the code makes the page reload over and over again. If it matters, the page is a marketo landing page on a marketo server.

Anyone ever tackle this use case before? Any ideas why the code below doesn't work?

<body>

</div>

function formAutoSubmit () {

var frm = document.getElementById("mktoForm_59");

frm.submit();

}

window.onload = formAutoSubmit;

</script>

</body>

Kenny_Elkington · ‎12-14-2015

Check out my blog on a similar topic here: http://developers.marketo.com/blog/make-a-marketo-form-submission-in-the-background/ You would want to use the MktoForms.whenReady method to then call submit() from the form.

View solution in original post

Phillip_Wild · ‎09-19-2016

I have a similar use case, and from the resources above I think I've cracked most of it. But for some reason, the form is submitting multiple times before it redirects (up to 6 times!)

Here is the code. I've put this at the bottom of a Marketo guided landing page template:

MktoForms2.loadForm("//app-ab06.marketo.com", "110-AIL-152", 1417, function(form) {

// From here we have access to the form object and can call its methods

MktoForms2.whenReady(function (form) {

form.submit();

});

//Add an onSuccess handler

form.onSuccess(function(values, followUpUrl) {

// Take the lead to a different page on successful submit, ignoring the form's configured followUpUrl

location.href = "http://www.google.com";

// Return false to prevent the submission handler continuing with its own processing

return false;

});

</script>

Maybe I don't need the custom redirect code in the second half - a bit unsure! Any guidance appreciated

Phil

SanfordWhiteman · ‎09-19-2016

Please post a link to your page. The redirect loop shouldn't happen if you're going to a page built off another template.

You don't need custom onSuccess if you want to use the value from Form Editor.

Phillip_Wild · ‎09-20-2016

Hi Sanford

Here's the link: http://letsgo.gadventures.com/Agent---National-Geographic-Content-Loading.html

The page it is linking to is built off a new template, yes.

Thanks, Phil

SanfordWhiteman · ‎09-20-2016

The problem is you are creating a crazy race condition in the order you're firing events. It only seems to work at all (and only in some browsers) when an error due to a timing combo allows the redirect to process. It's basically an infinite loop.

The order should be

1. MktoForms2.loadForm()

2. MktoForms2.whenReady() (not inside loadForm())

a. form.onSuccess()

b. form.submit()

Hence

MktoForms2.loadForm('//app-ab06.marketo.com', '110-AIL-152', 1417);
MktoForms2.whenReady(function(form) {
  /**
  * onSuccess is optional - only if you need to make client-side decisions about Thank You URL
  */
  form.onSuccess(function(vals, tyURL) {
    location.href = 'http://letsgo.gadventures.com/Agent---National-Geographic-Journey-Content-Requested.html';
    return false;
  });
  form.submit();
});

Phillip_Wild · ‎09-22-2016

Thanks Sanford! That works perfectly to submit the form. However, I've run into another problem.

When the form submits, it seems to be submitting under an anonymous lead. Here's my process:

1. I send an email to myself using my work email.

2. I click a button which has specific URL parameters which populate my hidden form.

3. The form submits in the background and automatically redirects to the landing page.

In my activity log, I can see the email delivery and the email click activities. But, I don't see any "filled out form" activities - in fact, I see them appear in an anonymous lead (which I found by using a "filled out form" smart list). So somehow I'm losing the association, and it's being assigned to an anonymous lead.

To try to mitigate this, I put "email address" as a hidden field and populated it via the URL as well. This simply meant that my anonymous lead now gained an email address - instead of Marketo deduping it as mine! Bizarre.

I've checked the page template and the only scripts that are there are these two:

and

MktoForms2.loadForm('//app-ab06.marketo.com', '110-AIL-152', 1417);

MktoForms2.whenReady(function(form) {

form.submit();

});

</script>

Any ideas?

Thanks again. Phil

SanfordWhiteman · ‎09-22-2016

Can you send me the (non-sample) email?

You also must QA test using Incognito windows, or you will get confounding results w/r/t cookie assoication.

Phillip_Wild · ‎09-23-2016

Sure! PM me your email address.

Thanks in advance.

Phil

Phillip_Wild · ‎09-23-2016

Sanford Whiteman has solved it! Basically, I was loading the form twice on the page - once through the Marketo editor in a guided landing page, and once more in the Javascript in the template itself. Which was making multiple form submissions! Once I removed the redundant loadForm line, it worked like a charm.

Chris_Vanderma1 · ‎10-19-2016

Great Thread, and thanks for showing examples Phil and Sanford! I've just successfully implemented this to solve a problem. Much appreciated!

Robb_Barrett · ‎12-14-2015

Couldn't this be more easily accomplished in a workflow? Visits Web Page in the smart list and then some formalized change data value steps in the flow.

Robb Barrett

SanfordWhiteman · ‎12-14-2015

Not really, because URL parsing isn't going to happen in the CDV step.

SanfordWhiteman · ‎12-14-2015

Definitely use Kenny's Forms 2.0 API method. Don't treat Marketo forms like generic forms.

But also, if the form's Thank You logic reloads the same page, then you will trigger the logic again, which you definitely don't want. Instead, you should either redirect to another page that doesn't auto-submit (based on query string or a totally different URL) or change the redirect logic to just stay put on the current page.

Derek_Vansant4 · ‎12-14-2015

So, testing outside of Marketo, I learn that the code above works if there is no submit button code on the form. Not sure how you remove the button input from a Marketo form or work around it.

Kenny_Elkington · ‎12-14-2015

Check out my blog on a similar topic here: http://developers.marketo.com/blog/make-a-marketo-form-submission-in-the-background/ You would want to use the MktoForms.whenReady method to then call submit() from the form.

Anonymous · ‎09-23-2016

I like this article, thanks for posting it

Derek_Vansant4 · ‎12-14-2015

Thank you!