: Input type="email" I have a form where I ask for email addresses. Usually I'd use <input type="email" ...> but I want to allow a user to type foo rather than foo@mycompany.com in the

@Sims2060225

HTML5 allows pattern="" attribute to be specified :


Specifies a regular expression against
which a UA is meant to check the value
of the control represented by its
element.

A regular expression that must match
the JavaScript Pattern production as
specified in [ECMA 262].


Examples:

<input type="email" pattern="[^ @ ]*@[^ @ ]*" value="">

<input type="email" id="email" name="email" placeholder="Enter your email address" pattern="^[A-Za-z0-9](([_.-]?[a-zA-Z0-9]+)*)@([A-Za-z0-9]+)(([.-]?[a-zA-Z0-9]+)*).([A-Za-z]{2,})$">


But I would use type="text" to be on a safer side -- in this case you can validate ANY user input.

Vote Up Vote Down

@Nickens628

You can use the new HTML5 pattern attribute to specify valid formats for an input field using a JavaScript regexp, then put the error message in the title attribute:

<input type="email" pattern="([regexp])" title="Your error message" />


However, in the scenario you describe, there's not much advantage of doing it this way over using type="text" except for the fact that Mobile Safari users will see an email keyboard instead of the full qwerty one.

As such, you might consider making it a requirement to use a company address, appending that in plain text after the text field, and prompting users for the first part of the email address rather than the full version.

Vote Up Vote Down

@Kristi941

If you're going to allow content that isn't in a valid email address format then you'll want to use <input type="text" ...> like you said. Although someone may enter a whole email address, it isn't exclusive to that field so using <input type="email" ...> would not be appropriate.

You can also turn off form validation if you don't want the browser to validate those fields for you. But that kind of defeats the purpose of using HTML5 features.

Vote Up Vote Down