Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

wizard form multi step form

@alfiandwi93

Desktop design screenshot for the Multi-step form coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
4advanced
View challenge

Design comparison


SolutionDesign

Solution retrospective


Does anyone here know if there is a tool that makes it easier for us to create a wizard form, I made this purely using JavaScript, in making this page I was confused about whether to finish the appearance first or create the appearance and logic at the same time, please give me input

Community feedback

@yaadevmohit

Posted

Congratulation on a good design. Think you can do logic for this faster with react. Here are few things to also consider with your solution:

  1. Design is good but you still have to implement validation for step 1.
  2. Step 4 change button is not working at all. It should bring back user to step 2 to make changes.
  3. Checkboxes are not working in step 3 properly.
  4. Also consider adding min-height for step 2 options so the height doesn't change with extra tag added (2 months free). It creates a more smoothing UI.

React will help you with creating this form much faster with hooks and stuff for the logic. But honestly great job with creating this form with vanilla javascript.

Marked as helpful

0

@alfiandwi93

Posted

@yaadevmohit thanks for the advice

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord