Some quick pointers


  1. The pattern attribute is only applicable for some <input> types, not all.

  2. We can only use pattern attribute on types of text, search, url, tel, email, and, as you've just seen in the previous few lectures, password.

  3. The value of the pattern attribute is a regular expression that must match the entire value of the input.

  4. Important: although we are writing our regular expression in HTML, it must be a valid JavaScript regular expression.

  5. But beware! If you have a pattern attribute and the user submits an empty input, it will still pass the test! In other words, an empty string is considered valid. Weird right. I know. To deal with this issue, we usually also have a required attribute on the <input> element as well.

  6. In combination with the pattern and required attribute, we often use the title attribute as well, which describes what pattern you expect. The item’s title attribute will be used to display an error message to the user.

  7. And finally ... Android, Safari and Mobile Safari support the pattern attribute. So you can be rest assured, its in wide use.