I'm currently having an input element for a phone number and trying to use the pattern attribute but it refuses to do so. it says "Validation(HTML5): Pattern is not a valid attribute of element input"! When I change the type to "text" it says that pattern attribute is only valid when title is present!
<input type="number" class="form-control"data-require="" id="Mobile" placeholder="Mobile No" autocomplete="off" pattern="[\+]\d{3}d{9}" required>
UPDATE:
I Added title attribute and it's working now! but my only issue is that when i click submit, it submits the form even though that the format is not matching.
The <input>
should be valid without the title
attribute (validated on https://validator.nu/):
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<input type="text" class="form-control" data-require="" id="Mobile" placeholder="Mobile No" autocomplete="off" pattern="[\+]\d{3}d{9}" required>
</body>
</html>
Additional changes:
data-require
.pattern
attribute is only allowed on the following types: email
, password
, search
, tel
, text
, or url
.Your regular expression ([\+]\d{3}d{9}
) is also invalid. You can try one of the following rules:
[\+]\d{3}\d{9}
[\+]\d{12}
You are missing the \
before the second d
to match only numbers. The second pattern is a minified version of the first pattern.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With