Design comparison
Community feedback
- @RenzorrPosted about 2 years ago
Hey bro, how did you get the warnings to not appear when typing an email incorrectly? 🤔🤔🤔
0@john-miragePosted about 2 years ago@Renzorr If you use React hook form, the useForm hook contains 2 options for the behavior of the input.
useForm({ mode: 'onSubmit', reValidateMode: 'onChange', // other options })
I will quote the documentation so i don't say mistakes.
Mode: This option allows you to configure the validation strategy before a user submits the form (onSubmit event).
reValidateMode: This option allows you to configure validation strategy when inputs with errors get re-validated after a user submits the form (onSubmit event). By default, validation is triggered during the input change event.
To replicate this kind of behavior without React hook form, maybe you can only listen to submit by default and if user submit wrong email you add an eventlistener (onInput or onChange for React) and validate the input each time the user press a key, after if he submit good value, you can unplug the onInput or onChange eventlistener from your input.
0
Please log in to post a comment
Log in with GitHubJoin 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