Disable input validation for input type=number

Question

I have a numeric input tag in a form element:

<form novalidate="">
      <input type="number" data-role="none" autocapitalize="off" autocorrect="off" autocomplete="off" placeholder="Quantity" class="quantityInput" />
</form>

When user types in any non-numeric value, the browser validates it and removes the whole text before submit call.

From the suggestions of other answers I tried using novalidate and novalidate="novalidate" attributes on the form. I also tried to tap invalid events. But nothing seems to work. The browser just removes the whole text if it is non-numeric before doing the submit call.

The reason to use input type="number" is that I need a quantity field in which user types something like 10 grams or 23 pcs etc. So by setting the input type="number", iOS shows the numeric version of the keyboard first.

How do I disable browser validation for input types of number?

possible duplicate of [Disable validation of HTML5 form elements](http://stackoverflow.com/questions/3090369/disable-validation-of-html5-form-elements) — Abdul Jabbar, Oct 09 '14 at 06:33
If you want both `numerical` and `textual` values, you will have to use `text` type instead. The `number` type will only accept numerical value.(literally) — Xlander, Oct 09 '14 at 06:36
can you share your input box code so all understand what's wrong? — Vinit Patel, Oct 09 '14 at 06:36

score 0 · Answer 1 · answered Nov 10 '20 at 07:30

0

The modern answer (as of 2020) is to use inputmode:

    <input type="text" inputmode="email">
    <input type="text" inputmode="tel">

answered Nov 10 '20 at 07:30

idmadj

2,565
2
19
23

Disable input validation for input type=number

1 Answers1