Html-css question

I have to take number input in html, but if user enterd text, then it shows html validation error, so how can i do these.

<label for="my-number-input">This input only accepts numbers</label>
<input id="my-number-input" type="number" required />

Number inputs are a bit of a pain though - by default they’ll have a little spinner that allows you to move it up and down, and that’s not always what’s needed. For things like phonenumbers, it’s useless, so there’s:

<input type="tel" required />

Which will not do an awful lot, but will show a telephone keypad on most mobiles, which prevents incorrect input. Anyway, text can be used in combination with a pattern to prevent non-numeric input:

<label for="my-other-number-input">This input only accepts any text but will show an error if anything except numbers is entered</label>
<input id="my-other-number-input" type="text" required pattern="^\d+$" />
1 Like

Hello friend, if the type attribute for the input element is number, then the user is supposed to fill in numbers, and if the type attribute is text then the user is supposed to key in texts.

1 Like