IMAT1604: Visual Web Development
HTML5 Data Validation - Input Patterns
Patterns offer the most sophistocated way check the users input
matches a required format. It is best used for those situations
where there is a clearly defined format. For example Post Codes.
Using patterns is not easy. They are however compatible with
JavaScript Regular Expressions and therefore can be easily used in conjunction
with JavaScript. A simple format of two letters follwed by 3 digits
would be [A-Z]{2}[0-9]{3}. Real post codes are however more
complicated and the suitable pattern is [A-Z]{2}[0-9]{1,2}\s[0-9][A-Z]{2} although better and more complicated expressions can be used.
When using a pattern, a title attribute is expected. This appears as
a tool tip prompt to the use when they approach the field.
Example of HTML5 Pattern Attribute
The above example is case sensitive, to allow lower and upper case [A-Z]
should be replaced with [A-Za-z] which would allow upper and lower case letters.