Javascript Multistep Form with Validation

Question

I am trying to create a multistep form using javascript and div. I know how to create the form this way but the problem is I want the fields in each step to be validated before moving to the next. Example: If the user did not fill up a required field or have error in a field the box will be highlighted in red and they will not be bring to the next step until it is corrected. I know how to do validation but not able to stop the page. Any help will be appreciated.

Thanks!

Answer 1

To stop the form from submitting you need to add

<form id="form" onsubmit="validate(); return false;">

Validate is your function for validationg, then you can call something like this

document.getElementById('form').submit()

if the form is valid ;)