Restraining mobile number input

Question

I have a form where I am accepting mobile number from users. Condition is that, I have to accept only the numbers starting from either 7, 8, or 9 and max length should be ten. I am using the following code for the same :

<input name="wno" id="wno" type="number" placeholder="Whats App No." required="required" minlength="10" maxlength="10" style="border-color:black" pattern = "/(7|8|9)\d{9}/">

But still the both the conditions are failing :

1) starting from 7, 8, or 9 & 2) max length should be 10.

Please guide me. Thanks in anticipation.

Answer 1

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

Your input type is number so the pattern is ignored.

Change your input type to text or tel and it will work as expected.

Source: https://www.w3schools.com/tags/att_input_pattern.asp