Horje

How to add HTML <input> pattern Attribute

An HTML form with an input field that can contain only three letters (no numbers or special characters).

Definition and Usage

The pattern attribute specifies a regular expression that the <input> element's value is checked against on form submission.

Note: The pattern attribute works with the following input types: text, date, search, url, tel, email, and password.

Tip: Use the global title attribute to describe the pattern to help the user.

Tip: Learn more about regular expressions in our JavaScript tutorial.


Browser Support

The numbers in the table specify the first browser version that fully supports the attribute.

Syntax

<input pattern="regexp">

Attribute Values

Value Description
regexp Specifies a regular expression that the <input> element's value is checked against

 

index.html
Example: HTML
<form action="/action_page.php">
  <label for="country_code">Country code:</label>
  <input type="text" id="country_code" name="country_code"
  pattern="[A-Za-z]{3}" title="Three letter country code"><br><br>
  <input type="submit">
</form> 

Output should be:

How to add HTML <input> pattern Attribute




Type:
html
Category:
Web Tutorial
Sub Category:
HTML Tag
Uploaded by:
Admin