javascript – How to add validation to multistep form from w3schools

javascript – How to add validation to multistep form from w3schools

  • You dont really need any javascript validation, Browser can validate the form for you in the clients own language as long as you use the appropriate type/pattern/min/max/required/maxlength/minlength attributes.
  • But for the validation to take place you must instead of using button click event, use the submit event and event.preventDefault() to stop the default behavior from navigating away. That way browser will validate the form using the constraint validation

if you dont like the look of the constraint validation then you can use the validation api and look at stuff like input.validity object among other things

you have it ready on html as attribute of the input

but in order to takes place you will have to change the code a little bit
and make all the logic inside a tags and submit the form using a button
and then e.preventDefault() like the other answer told

for more information check this

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes

you can just use this attribute to required that input cannot to be empty

 <input type=text required >

required like this ^^^

for minlength just use minlength attribute

<input type=text required minlength=5>

like this ^^^

input type email will check if you input an email ish string

<input type=email >

like this ^^^

will take any string that has acb@dddd.com

hopes that helps !!!

but if you need more validation then that you will have to create your own 🙁

maybe this video will able to help you out

https://www.youtube.com/watch?v=In0nB0ABaUk

javascript – How to add validation to multistep form from w3schools

Leave a Reply

Your email address will not be published.