Multi step forms

Design help Custom code
1

Hi Everyone,

First of all, thanks to Webflow team for proposing us such an awesome platform! Really a super great job ! :heart_eyes:

I am new here and I really need help to integrate a two steps form (I am not a programmer and I have seen on the forum that I need some jQuery).

Here what I need :

  • Form Step 1 composed as the following :

  • an input field called work (with max 50 caracters)

  • an dropdown called company (A, B, C)

  • a button “Go to step 2”

  • Form Step 2 composed as the following :

    • a dropdown for Civility (Ms, Mrs, Mr)
    • an input for name (with max 50 caracters)
      an email input
    • a phone number input (for being valid, this input needs to be number type, to have exactly 10 caracters and the phone number have to be between 0100000000 and 0999999999)

  • 1 button “Go back”

  • 1 button “Submit”

Here what I want to do on Form Step 1 :

  • Having a transition between step 1 and 2 forms in the same page when the user click on “go to step 2” or “Go back” button
  • Having notification boxes (same as used in webflow form submission) if an input field or a dropdown is empty/unchanged when “Go to step 2” button is clicked
  • Avoiding email sending when “Go to step 2” button is clicked (I just need to switch to Form Step 2 if all fields are completed)

Here what I want to do on Form Step 2 :

  • When button “Submit” is clicked and all fields are well completed, I would like to have notification boxes (same as used in webflow form submission) if fields are empty/unchanged
  • sending an email to the user gathering all step1 and step 2 data + Bcc to my personnal email in order to have a copy and a notification when I have a form submission.
  • when button submit is click and the process succeed go to another page call “www.example.com/submit-form-sent”

What would be very cool too is to have a green check icon near each inputs/dropdown when fields are well completed. (But it is not a extremly urgent)

I know that I ask a lot but I have already searched and lost plenty of hours on WF forum and google trying to do that :confused:

Waiting for your help,
Thanks in advance,
JP

2

You should check out https://www.typeform.com. I have successfully embedded it into a webflow site.

3

Hi DFink,

Thanks for your quick answer !

I am going to have a look at it and let you informed :wink: