Re: Two Part Form Submittal

Kathi_Gosche
Level 4
Does anyone know how I might be able to have a form submitted, then present the user with a second form that doesn't requite the user to re-enter thier email address? I know field logic would do something similar in a single form, but then the form can't be submitted until all fields are supplied. Longer forms mean more abandonment. If I can get the basic info on the first form, I have them in the system. Indepth qualifing info could then be gathered by the second form.

Some users may not complete the second form, but many would if I tell them this will speed up our turn around time. But I don't want to annoy them by asking for email address when they just supplied it on the previous form.

Any and all ideas are welcome. Thanks in advance.
Tags (1)
51 REPLIES 51
Kathi_Gosche
Level 4
I'll give this a shot Sanford. Thanks for the suggestion and code!
Anonymous
Not applicable

I am now using your code Sanford.

But, how to add another form ?

and how to remove the email parameter ?

thank you so much

SanfordWhiteman
Level 10 - Community Moderator

Add another form by just nesting it the same way: MktoForms2 :: Progressive Form Substitution - JSFiddle*

You don't want to get rid of passing the email because that's how you make sure Marketo will tie each form's data to the same lead.

* This would be better done using a recursive function when you go over 2 forms, but I don't have time at the moment. Will edit later.  The demo now uses a recursive function so you can stack as many forms as you want (the `formidStack` array up in the config section) without adding more code. 

Samantha_Cossum
Level 3

Hi Sanford Whiteman‌,

Is there a way to do this with branching forms? We use an outside web development company and they added our Marketo forms to our site but put each step on a different page (we wanted multiple forms so we could "save" the progress if they don't finish). I was going to send this chat and you code to them so they just have the forms replace but one of our forms branches into 3 different versions based on a choice of a question.

Hope that makes sense!

SanfordWhiteman
Level 10 - Community Moderator

Can this be adapted to have next form in the sequence determined dynamically in the onSuccess, based on responses submitted in the previous form? Certainly!. 

Since you already have devs engaged I assume they're pro enough to get this done.

Anonymous
Not applicable

thank you so much for your reply sanford !

Anonymous
Not applicable

another question : my forms are now stuck on the bottom left corner - why ? and how do I move them where i want ?

thanks

SanfordWhiteman
Level 10 - Community Moderator

Get a copy of the latest code (now v23) from the link.  In the config section, set `insertInsideSelector` to the element you want the form to go inside.  In the demo it's being inserted inside the <DIV> with id="exampleContainer".

Anonymous
Not applicable

Great - thank you !

Now I am working on putting the button on the right handside for each forms. Do you have a code for this ?

Anonymous
Not applicable

Found it - now I am worrking on the progress bar. Do you have some tricks ?

thanks

SanfordWhiteman
Level 10 - Community Moderator

What tricks other than the PROGRESS element as in the demo?

Anonymous
Not applicable

This could be : how to insert pictures inside the progress bar / gradient/ other CSS elements that could be attractive  ?

So it looks a little bit more professional

thanks

SanfordWhiteman
Level 10 - Community Moderator

Those are design choices for a web designer.  The Community is for problem-solving (IMO).

Anonymous
Not applicable

OK no worries, could you please tell me how to place the forms on the top left on url : http://pages.videojet.com/lp-MSF.html

thanks

SanfordWhiteman
Level 10 - Community Moderator

You mean inside the DIV 'outerWrapDiv'?

In the config section, set

     insertInsideSelector : '#outerWrapDiv'

Anonymous
Not applicable

Hi Sanford,

In case of someone stops filling out the forms and drop the process in STEP 1 (which is only asking for the email)

What if I want to receive via an alert from marketo, the email from the first step ?

what javascript can I use ? or any other solution ?

thanks

SanfordWhiteman
Level 10 - Community Moderator

A Smart Campaign that triggers on the first form name. That's the power of this solution: each form stage is a separate activity in Marketo.

Anonymous
Not applicable

Does the smart campaign need to be inside the same program as the forms ?

SanfordWhiteman
Level 10 - Community Moderator

Nope, the form can be global (and I usually recommend global forms for sanity's sake).

Anonymous
Not applicable

thanks.

when someone double click on the button - the form pops up twice. Do you know how to limit this to pop only once ?