Multi Step Form made in Webflow and WeBlocks

In this episode of WeBlocks Academy, we learn how to create Multi-Step Forms. It's fully created in Webflow and WeBlocks, a tool to create JS code in a no-code way with Blocks.
Project
multi-step-form-weblocks.webfl...
Cloneable Webflow Project
webflow.com/website/Multi-Ste...
WeBlocks
www.weblocks.com/

[@harshitagrawal5589]

Mac is back with another cool tutorial 🔥

[@pablocortes682]

This is amazing! What a great tool. It's a game changer. Please keep the tutorials coming!

[@sebastiannejfeld5437]

Maciek. This is exactly what I needed today. Are you reading my mind? Bravo!

[@barbaragaldos7955]

this is absolutely amazing! thank you so much!

[@bramgerrits9335]

Thanks!

[@xenoserie4653]

Awesome guide, thanks

[@philipbeckmann5318]

WHAT THE FUCK! Thats a complete game changer. I am blown away. In the paste we had such a pain in the a** to make this possible.

[@weblocks]

Wow! Nice! Thanks, Philip!

[@edelprojects8308]

Thank you!!!!! helped a lot, please show us more tutorials!

[@joshstallings5474]

This is genius! I was looking for something like this!

[@weblocks]

Thanks, John! I'm happy WeBlocks is helping you!

[@gesigna]

this is awesome - gr8 tool

[@ArtfulUI]

amazing tool!

[@amulpatel]

this is BRILLIANT.. keep building more clones ... typeform please, gumroad please, patreon please

[@TheKetoSurvivor]

WoW! 😲

[@vitaliimykhailyshyn6887]

Thank you for tutorial ! Where all information goes after submission?

[@aironorphan]

hey man, thanks for this tool, its amazing! for some reason, when i click next and go to the next tab, the previous button doesnt show up on second tab. I made it that when button is inactive, its view is none. the next button appears when active however the previous button doesnt show up on second tab. do you know why this might be? thanks

[@crazywolf210897]

Thank you for the video. Can I ask where will the data which user input be stored?

[@plottperformance5893]

Would it be possible to use this with the CMS to be able to pull the text from a collection?

[@user-oh3fh6ps2t]

Thanks, this looks amazing. Does it work with ecommerce Webflow? can I make the price to the final price of the product?

[@henrikholt5149]

How do i edit the "Radio Circle Box" color ect when selected? Can't find a way to edit this...

[@russellcurtis5645]

Hi, thanks for the video!! I am creating a website for a client. They provide online Wills. The functionality I need is to have the user fill out an application form and at the end of the form make a payment, and then the form is submitted. It is also quite important that the user can create an account before they start the application form, so that they can save progress and continue at a later stage. Do you know how this could be possible, and what third-party applications need be integrated to achieve this goal? Thanks, Russ

[@KTKettler]

This is amazing! One question, is there a way to check for required fields before going to the next step?

[@weblocks]

Thank you!! At this moment, we don't have blocks to check if input is required in HTML, we can set it up using if statements only. But it's a great idea, I will think about how to add this functionality!

[@KTKettler]

@@weblocks Thanks for the response, that would be fantastic if you added that functionality!

[@efmajacksonrosario1390]

@@weblocks Any updates on this? Also when you submit the form where is all the data sent to?

[@abinkumar7176]

hey, could we build a form that submits the data to the webflow CMS or probably can use webblock's database? Would definetely solve a lot or problems and could probably can create custom backends.

[@weblocks]

very very soon! I plan to launch this functionality next week!

[@theadalric]

Great work! I had some questions about the multi-selection pages for the form with the checklist elements. When I submit the form, in the Webflow settings page for my website, it just shows the responses as true or false. Is there any way to show the name of the option(s) selected since having true/false doesn't offer any information. Thanks in advance!

[@weblocks]

Thank you Adalric, I think you need to give the name of the checkbox, then you will know which checkbox is true or false

[@theadalric]

@@weblocks Thank you! this works

[@jorgelasvignesuxdesigner161]

I am doing the same steps as you have but my next button does not activate. Would someone be able to help me?

[@po-yichi5261]

Hi, can weblock form logic work with calculations and conditions? i.e. if Input x times Input y is between 80 and 100, then output (x*y) /14 on the screen.

[@weblocks]

Hi, yes, I would recommend watching video about calculations in WeBlocks, it will help you to achieve that

[@samtremelling9807]

Hey! I have copied this from your clonable template! When I try to click to select an option it just won't select. Do you have an email I would be ableto come in contact with?

[@saintmaria7482]

What If I want at least one checkbox to be selected to active the next button? And also, I can't find anymore the "input on change" block!

[@weblocks]

To do it you would need to set up the next tab only on change this on chaeckbox. This is the second block in "Forms" section

[@weblocks]

Hi@Mayur Pokle! Names for tabs and inputs needs to be different, "input on change" works only for inputs not tabs

[@realsamratc]

But how to embed the final calculation into the from filed with readonly mode so we can send the data with the final calculation like high-five studio

[@weblocks]

Hi Samrat! You need to create hidden input, send value to that input, and it will be sent when the form is submitted

[@realsamratc]

@@weblocks Thanks a lot. really help ful

[@eslfungus9]

Can you guys help me understand when to use Class, ID, Tag or Bloc as a trigger? And what is bloc btw? I've never heard about it before and can't find any information about it. Thx :)

[@weblocks]

hey, we are starting preparing NoCode JS 101 course, this is pre-premier version of video about topic you are interested: www.loom.com/share/8175305a382c4353ac3cf2183fe9d986 I hope it helps

[@eslfungus9]

@@weblocks awesome, thank you

[@nickbertram1482]

If you have a multi optional form how would you use weblocks to create multiple paths within the form?

[@weblocks]

Hey Nick, in 14:00 I talk about conditional logic in form

[@nickbertram1482]

@@weblocks It looks like you updated Weblocks. I'm looking for the first block in forms but it is not how it looks in the video, what block replaced that? I'm looking for the block @ 4:37 in the video for the second step in the video.

[@weblocks]

@@nickbertram1482 At this moment is block number #2 in this section

[@ShuaibAzam]

Hi! Are the subscriptions up? I am trying to upgrade, but I am unable to do so. Can you please advise what to do ?

[@weblocks]

Hi! Thank you for using WeBlocks! Yes, you can do the upgrade here www.weblocks.com/upgrade , please send me an email at [e-mail] to receive a refund for Lite Plan. Thanks, Mac

[@ahmedrioo2849]

if i'am on a free should i copy the entire code after finishing and then put it into webflow? the code is gonna be +1000 characters and webflow wont accept it

[@weblocks]

if you are on free and code is longer than 1000 you can use Netlify for hosting

[@sam-45632]

is there an option to work with select fields?

[@weblocks]

yes, your project should also work with select fields. If something is wrong please send me more information through weblocks support system or send an email: [e-mail]

[@alejandrasalgado3378]

It doesn't work for me :( when I clone your project I see that the next and prev buttons are not really buttons, they are divs. Whether I use buttons or use divs it's not working, how did you make those buttons?

[@weblocks]

Hi Alejandra! I think in the example buttons are connected with WeBlocks using the attribute "bloc" take a look if you are doing the same. I hope it helped

[@fernandocruz18]

the WeBlocks project does not work...

[@weblocks]

Hi Fernando, we are here to help and assist. Please send me a message [e-mail]

[@vitaliimykhailyshyn6887]

As tried to make this, reveals that it is absolutely not effective lesson. Nothing about submission, where the data comes in Webflow, and how to hide submission buttons on forms in tabs. So it`s pretty but totally useless.