Pattern Attribute:
Pattern attribute is used for input field validation and used to provide a regular expression which is used to match the input fields value whether the value is according to the pattern specified or not.
When user enter a value in the input field and if the value entered is not as per the expected format, then a error is thrown and our form will not submit until user does not provide correct format value.
Syntax:
<input pattern="regexp">
Attribute Value:
| Value |
Description |
| regexp |
Specifies a regular expression that the input field value is checked against |
Example:
<!DOCTYPE html>
<html>
<body>
<form action="">
<p>Name: <input type="text" name="username" placeholder="Username"></p>
<p>Address: <input type="text" name="username" placeholder="Username"></p>
<p>Phone No: <input type="text" name="phone" pattern="[0-9]{10}" title="ten digit number only">
<p><input type="submit"></p>
</form>
</body>
</html>
In the above example in the phone number field we have used pattern attribute and this field will only take 10 digits number otherwise the form will not submit.
0 Comment(s)