Make a Marketo Form Submission in the background

[Kenny_Elkington]

This post originally appears on the Marketo Developers Blog

When your organization has many different platforms for hosting web content and customer data it becomes fairly common to need parallel submissions from a form so that the resulting data can be gathered in separate platforms. There are several strategies to do this, but the best one is often the simplest: Using the Forms 2 API to submit a hidden Marketo form. This will work with any new Marketo Form, but ideally you should create an empty form for this, which has no fields:

This will ensure that the form doesn’t load any more data than necessary, since we don’t need to render anything. Now just grab the embed code from your form and add it to the body of your desired page, making a small modification. You embed code includes a form element like this:

<form id="mktoForm_1068"></form>

You’ll want to add ‘style=”display:none”‘ to the element so it is not visible, like this:

<form id="mktoForm_1068" style="display:none"></form>

Once the form is embedded and hidden, the code to submit the form is really quite simple:

var myForm = MktoForms2.allForms()[0]; 
myForm.addHiddenFields({ 
     //These are the values which will be submitted to Marketo 
     "Email":"test@example.com", 
     "FirstName":"John", 
     "LastName":"Doe" }); 
myForm.submit();

Forms submitted this way will behave exactly like if the lead had filled out and submitted a visible form. Triggering the submission will vary between implementations since each one will have a different action to prompt it, but you can make it occur on basically any action. The important part is setting your fields and values correctly. Be sure to use the SOAP API name of your fields which you can find with Export Field Names to esnure correct submission of values.

[SanfordWhiteman]

.whenReady will trigger whenever a form is ready for use; it will not by itself create a loop.  But if you already are redrawing the form after submission, then you will have a loop, since every time it redraws whenReady will cause it to resubmit, over and over.

[Cecile_Maindron]

thanks! hope our web dev. will know what to do next....

[Cecile_Maindron]

Sanford WhitemanKenny Elkington

Huge thanks for your support. This is working, you rock! I just have another issue and it doesn't look like this has already been addressed:

Marketo is automatically transforming all the anonymous activities on my TY pages (e.g. www.talend.com/download/thankyou/mdm) - where hidden form are hosted - into new leads. I believe that this is due to fact that there is a submitted form, even if form is hidden. How can I prevent this from happening?

[SanfordWhiteman]

Then you want to only conditionally run form.submit() if

1. the lead is already known; or
2. the lead is becoming known during this form post (i.e. you are osting their email = identifying info)

You can take advantage of the Forms 2.0 Known Lead HTML feature to determine if the lead is already known.  If the KL HTML is rendered, then the lead is known.  Conversely, if the KL HTML is not rendered, the lead is not already known, but if the Email field is not filled in you should not submit the form because it's just going to create the clutter you're mentioning.

The code your dev added to stop the form from submitting repeatedly is also broken.  Plus I don't get the waiting 5 seconds to submit the form; that's just going to mean you lose the form post if someone goes to another page within 5 seconds.  Why would you want to do that?

[Cecile_Maindron]

Sanford Whiteman​ Thanks again for your prompt answer. I have some trouble following you. I thought the custom .html was used so that known leads don't have to submit form. In my case I want the form to be submitted by known leads and not submitted by anonymous leads to avoid the creation of net new leads with 0 data.

So if I add the Forms 2.0 Known Lead HTML feature how can it work?

Or do you mean that my web dev. should use the feature to determine if lead is known and then apply the following logic : if feature is activated = lead is known = submit form?

[SanfordWhiteman]

The KL HTML isn't technically so known leads don't submit the form, it's used so leads don't see the form fields.   The default button that is included in the KL HTML still submits the form and in fact generates a Filled Out Form activity.  (I think this is commonly misunderstood.) 

You can remove the submit button and use only direct <A> links in the KL HTML, but it can impact reporting. The form created w/KL HTML doesn't support every feature the full form does (which may be the result of bugs more than intent). Regardless, the goal of the KL HTML is to simplify the form for repeat visitors, not truly remove it. 

So what I'm saying is that you can use the presence of KL HTML to determine if the cookie is associated with a known lead (there's an undocumented method that it uses under the hood, but it's best to leave that alone). Then you will know if you're in 1 of the 2 contexts in which it's safe to resubmit the form automatically (the 3rd, unsafe context being where the cookie is still anonymous and the lead has not provided any identifying info).

[Sarah_Greig2]

We've used this method a few times now but for some reason we can't get it to work now.

We are using this code:

<!DOCTYPE html>

<html>

  <head>

  <meta charset="utf-8">

  <style type="text/css">

  input {

  padding: 10px;

  margin-bottom: 10px;

  border: 1px solid #ccc;

  width: 200px;

  display: block;

  }

  </style>

  </head>

  <body>

  <form id="mktoForm_0025">

  </form>

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

<form id="mktoForm_0025" style="display:none"></form>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

  <script>

  var myForm = MktoForms2.allForms()[0];

  myForm.addHiddenFields({

  'Email' : "test@testing12345.com",

  "FirstName' : "John Doe"

  });

  myForm.submit();

  </script>

  </body>

</htm

Not sure what the google api is doing but is this causing a conflict within the system?

[Kenny_Elkington]

Are you getting any errors on page load in your console?

[SanfordWhiteman]

You have the <FORM> tag twice.  But more important, where's the code to load the form?

[Lucho_Soto]

I think a full example of this would be extremely helpful as well, especially for those of us who aren't well-versed in PHP/javascript. Can we see a complete set of code showing a simple PHP form passing information to a hidden Marketo form when submitted?