2

Is it possible to require a "." after the "@"?

The required validation only forces an email to have some content after the "@", but I would like to require a "." to make the user type in ".com/.org/etc"

http://jsfiddle.net/X6Uuc/333/

enter image description here

evan
  • 954
  • 3
  • 18
  • 37
  • Check the second answer: http://stackoverflow.com/questions/5601647/html5-email-input-pattern-attribute – Tim Mar 26 '15 at 19:04
  • I'm able to use type="email", but it allows the form to submit without having a ".com/.org/etc" – evan Mar 26 '15 at 19:06
  • Yes. Check out parsley.js, its a more fully featured input validation library –  Mar 26 '15 at 19:12
  • FQDNs don't have to have a dot in them. It's unusual for someone to run an email address directly off a TLD but not unheard of (and more likely to happen with the recent massive influx of new TLDs). – Quentin Mar 26 '15 at 19:23

1 Answers1

5

If you're relying on the input[type=email] you can also use the pattern attr:

I got theRegEx in the example below from the W3C spec for the email input. The native pattern uses * in the last part then it's not required, I only changed it to +;

<form>
  <input type="email" pattern="^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)+$" required />
  <button>Submit</button>
  </form>
Luizgrs
  • 4,765
  • 1
  • 22
  • 28
  • This has more validation, but isn't turning valid when i type in a full email address: http://i.imgur.com/7Ir3Wn7.png – evan Mar 26 '15 at 20:12
  • Yes it works, I need to have both `oninput="setCustomValidity('')" oninvalid="setCustomValidity('Please enter your full email address.')"` – evan Mar 30 '15 at 02:02