Multiple copies of same form on a page problems...

[Anonymous]

Hi,

using embedded 2.0 forms I've run into a problem with having multiple copies of the same form on the same page - I'd guess because they all have the same form ID.

My coworker - who runs our email marketing process - is looking to simplify how many forms he has to maintain and I'm investigating ways to help him do that We want to have a form with the same set of fields appear multiple times on our product pages, in a popup, in a sidebar, inline in the content etc...

What I'm seeing is:

• the first form loads correctly
• when the second instance loads it inserts a duplicate set of form fields into the first instance.
• every further instance adds another copy of the fields to all other instances which have the the same ID  - eg  "mktoForm_1234".

Is there an easy way to work around this? Or should I just make multiple copies of the same form in the backend of Marketo, and he will have to update them all separately when a change is needed?

I'm aware I could be using the API to send and receive info - and bypass the whole problem - but I'd like to keep things simple for now.

[SanfordWhiteman · Accepted solution]

Simple enough. As demoed in earlier Community posts: MktoForms2 :: Same Form Multiple Times​

Set the <FORM> tags as shown, adding the form ID to the data-formId attribute instead of the literal id attribute. The code will manage the attributes for you.

[Anonymous]

Thanks - I'll give it a try.

[Dan_Cunningham]

This is great. Suppose you needed to have multiple forms load more than once on one page. Would that be possible? For instance:

<form class="mktoForm" data-formId="341" data-formInstance="one"></form>

<form class="mktoForm" data-formId="341" data-formInstance="two"></form>

<form class="mktoForm" data-formId="341" data-formInstance="three"></form>

<form class="mktoForm" data-formId="342" data-formInstance="one"></form>

<form class="mktoForm" data-formId="342" data-formInstance="two"></form>

Thanks,

Dan

[SanfordWhiteman]

Hi Dan Cunningham​! Sorry for the delay. Yes, you absolutely can do this. Check out

     MktoForms2 :: Many Forms, Many Times

[Dan_Cunningham]

Fantastic, thank you!

[Dan_Cunningham]

This is probably pushing the limits, but what if you needed to conditionally run a function?

MktoForms2.loadForm("//app-sjqe.marketo.com", "718-GIV-198", 621, function(form) {

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

});

Would it be possible to target a specific ID using your method?

Thanks,

Dan

[SanfordWhiteman]

You mean one of the copies of a specific form ID? Or all forms with that ID?

[Dan_Cunningham]

Ideally, all forms with that ID.

[SanfordWhiteman]

Sure, check form.getId()...

MktoForms2.whenReady(function(form){
  if( form.getId() == 1234 ) {
    // do something only with form ID 1234
  });
});