Can we build two step form in marketo by using custom JavaScript? | Community
Skip to main content
Sant_Singh_Rath
Adobe Champion
Sant_Singh_RathAdobe Champion
Adobe Champion
March 15, 2019
Solved

Can we build two step form in marketo by using custom JavaScript?

  • March 15, 2019
  • 2 replies
  • 10076 views

Initially I want to show 4 fields then instead of submit button I want Next button which will take the person in the form with remaining fields and then he/she have to submit the form and lead will be created in marketo?

My understanding is:

1. We can show 4 fields in the page load event and hide the remaining one and submit button

2. After 4 fields we can add a rich text to make "NEXT" button

3. In the "Next Button" click event we can display remaining fields with submit button.

Has anyone build this solution or kind of. If you can provide me the code then it will be really helpful.

Thanks in advance.

Sant

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    Best answer by SanfordWhiteman

    Check out

    MktoForms2 :: FSaaT v1.0.0​ (FSaaT = Fieldset-at-a-Time).

    5c907dad4c52a500bf5f9c51_fsaat_01.png

    You'll need the code from the CodePen CSS pane (very basic) and the JS pane (not at all basic).

    The underlying form in Form Editor is as simple as can be. Each "step" is a Fieldset (the Fieldset's <legend> doesn't actually matter as it is not shown, nor is the border). You can add an unlimited number of steps and the code adjusts accordingly.

    Note no fields are marked Required in Form Editor: that logic has to move into custom validation JS because of how significantly we're altering the display.

    As you can see, the only part you'd have to customize for your form is the stuff above /* --- NO NEED TO EDIT BELOW THIS LINE! --- */: the required fields + error messages, and the labels for the previous and next buttons. You can also choose to turn off the previous button (I don't recommend this, it's weird IMO but I built it in anyway).

    This is still a work in progress. It takes a dramatically different approach to my past multi-step forms, but I'm still adjusting for some corner cases.

    2 replies

    SanfordWhiteman
    SanfordWhiteman
    Level 10
    March 15, 2019

    If you search my past posts, I've shown a couple of different ways to approach this.

    Sant_Singh_Rath
    Adobe Champion
    Sant_Singh_RathAdobe ChampionAuthor
    Adobe Champion
    March 15, 2019

    Sure! I will try to dig this jewel from your treasure.

    ~ Sant Singh Rathaur
    Jay_Jiang
    Jay_Jiang
    Level 10
    March 17, 2019

    In short yes it can be done.

    If you're struggling with a marketo only form, and all else fails, build your own form and submit the answers to marketo in the background

      Sant_Singh_Rath
      Adobe Champion
      Sant_Singh_RathAdobe ChampionAuthor
      Adobe Champion
      March 18, 2019

      Thanks for the suggestion @Jay Jiang​. I will try to get this work.

      ~ Sant Singh Rathaur
      SanfordWhiteman
      SanfordWhiteman
      Level 10
      March 18, 2019

      I found my demo from a couple of years ago. Let me just refactor it a bit and will post tomw (uses some techniques I don't use now).

        Terms & ConditionsAccessibility statement

        Loading footer...