Client side form validation using JS

Community feedback

• 

  Tesla_Ambassador•3,000

  @tesla-ambassadorPosted over 2 years ago

  Hey Renan. This is a pretty sharp solution. I like that the layout is really responsive it's smooth. One thing I'd like to recommend is that you can reload the web page to simulate a submited form by setting a timeout function to trigger the window.location.reload(); function. I think it'd be great for your solution!

  Marked as helpful

  0

  ---

  

  Renan Tiscoski•1,240

  @DonUggioniPosted over 2 years ago

  @tesla-ambassador Hey,

  Thank you for your input! That's a great tip, I was actually wondering how I could do that. Will look it up and implement it.

  1

  

  Tesla_Ambassador•3,000

  @tesla-ambassadorPosted over 2 years ago

  @DonUggioni Sure thing Renan! Glad I could be of help

  0

  

  Renan Tiscoski•1,240

  @DonUggioniPosted over 2 years ago

  @tesla-ambassador Perhaps you could help me. I am not sure where I should place the timeOut function. Because, I want to trigger the timeOut whenever all conditions are met, and right now, it runs no matter what.

  0

  

  Tesla_Ambassador•3,000

  @tesla-ambassadorPosted over 2 years ago

  @DonUggioni let me get at it👍

  0

  

  Tesla_Ambassador•3,000

  @tesla-ambassadorPosted over 2 years ago

  @DonUggioni You might want to add this piece of code at the end of your display success message function:

  setTimeout(() => {
      window.location.reload();
    }, 3000);
  

  It will fire after 3 seconds.

  0

  

  Renan Tiscoski•1,240

  @DonUggioniPosted over 2 years ago

  @tesla-ambassador Have the same issue. Whenever I click the submit button, it displays the error messages and after that reloads the page. I've tried placing it after calling the validateForm function inside de event listener call back and same thing happens. If I place it inside any of the if statements it fires either way. Now I wonder how one could do that.

  Also tried calling clearTimeout in the if statements but that doesn't work either.

  0

  

  Tesla_Ambassador•3,000

  @tesla-ambassadorPosted over 2 years ago

  @DonUggioni You need to place that at the end of your display sucess( ); function. I cloned your repo and tried it and it worked!

  0

  

  Renan Tiscoski•1,240

  @DonUggioniPosted over 2 years ago

  @tesla-ambassador Will try again.

  1