Multi step form with React, Typescript and Tailwindcss

Community feedback

• 

  WandoCode•840

  @Wandole

  Posted over 2 years ago

  Hey,

  For the form validation, you could validate each field separately in a given function.

  To make the validation:

  • the name field => just check the length of the value (string)
  • the email field => you can use a RegEx and the method <string>.match()
  • the phone field => use an input:text and RegEx/match too!

  When a field doesn't pass the validation, you can add the name of this field in an array/object and when every fields has been checked, you return the array/object to your main function.

  That way, if your validation function return an empty array, you know the validation has passed, otherwise, you have the name of the field(s) that are not valid and you can display that on screen using a state!

  There are probably other ways to do that, but that's how I do it!

  I hope it helps!

  10

  Marked as helpful
• 

  👾 Ekaterine Mitagvaria 👾•7,860

  @catherineisonline

  Posted over 2 years ago

  Look nice! I would also add validation for the name input so I cannot write any number values :))

  IF THIS WAS HELPFUL PLEASE MARK IT AS HELPFUL 🤩

  00