The pattern Attribute

Firefox 4+	Safari 5+	Safari 4+	Chrome 10+	Opera 11+	IE 10+	Android 2.3+

The Low Down

Using the pattern attribute, you can declare your own requirements for validation using Regular Expressions.

• Relevant for the text, search, url, tel, email, and password types: the input types that allow for freeform data entry and don’t have predefined patterns the values must match.
• The value of the pattern attribute is a regular expression that must match the entire value of the input.
• The empty string is considered valid (no misMatch) unless the requiredattribute is present as well (valueMissing).
• The regular expression must match the entire value, not just a section of the value, as if it started with ^ and ended with $, which is different than you might be used to in JavaScript pattern matching.
• For email input types, if you include both the pattern and multipleattributes, remember that the pattern must match the entire value!
• Use the title attribute to describe what pattern you expect, as per the spec. When the pattern attribute is included, the item’s title attribute gets special meaning. If there is a patternMismatch during constraint validation , the title value will be included as content in the error bubble displayed in supporting browsers – as displayed to the left (“Enter 3 characters” was the title). That’s why the previous point — describe the pattern you expect, not the purpose of the input — is important to remember.
• If the pattern attribute is present, the non-empty value must match the pattern attribute. If the value does not match the regular expression, the patternMismatch constraint validation error message and title will be displayed in the error bubble upon form submission.
• Resource of useful patterns
• Android, Safari and Mobile Safari support the pattern attribute, but do not support form validation, so will not prevent an incorrect value from being submitted, but do support the UI pseudoclasses.