Using "Pattern" within the input in a form does not work
I've watched Kevin's video "Improve your form validation hints without JS!" I've added the "pattern" attribute with the regexr code. But this is not working. The form validate even when the email input is not fully complete. Need some help. Here's the link: https://jeancyjr.github.io/newsletter-sign-up-with-success-message-main/
5 Replies
this is a case where you don't need the attribute
the validation is built into the field
So when using the pattern attribute with input type = email can have issues because the email input already enforces default validation , so there's possibly a conflict with your regex. You'll want to use one or the other. You could even start with type=email in your html then with your Javascript change it to type text, in case the Javascript doesn't load.
Also remember to test on different browsers
i recommend that you just remove the pattern
even without javascript, the form does some basic validation before submitting
you just need to add the
required attribute to the field
also, using the type="email" will automatically change the keyboard to an email keyboard for android and ios
that is a HUUUUUUUUUUGE usability upgrade
since that is just for a front-end mentor exercise, you can just leave it as-is - no javascript neededThis sounds like the only solution indeed
I've removed the pattern attribute
it's not the only solution, but it is the best one