Integer only input Javascript

Question

I am unsure on how to create an input box that only allows integers to be inputted. I have made a HTML version of the input but I need the same input type within JavaScript.

Here's my current HTML input

<input type="text" autocomplete="off" ondragstart="return false;" ondrop="return false;" onpaste="return false;" onkeypress="return event.charCode >= 48 && event.charCode <= 57;">Amount</input>

see http://stackoverflow.com/questions/469357/html-text-input-allow-only-numeric-input — Philipp, Mar 22 '16 at 09:39

Tyler Crompton · Answer 1 · 2016-03-22T10:00:06.843

2

You should change type="text" to type="number". You might also be interested in setting values for the min, max, and step attributes as well.

var input_element = document.getElementById('input');
var output_element = document.getElementById('output');

document.getElementById('form').addEventListener('input', function (event) {
    output_element.value = input_element.value;
});

<form id="form">
    <label for="input">Input:</label>
    <input id="input" type="number" min="0" max="10" step="2" />

    <br />

    Output: <output id="output" for="input"></output>
</form>

edited Mar 22 '16 at 10:00

answered Mar 22 '16 at 09:39

Tyler Crompton

12,284
14
65
94

Is there a way to remove that up/down button from that number text box? May be OP requires that. – Rajaprabhu Aravindasamy Mar 22 '16 at 09:49
Not that I'm aware of. – Tyler Crompton Mar 22 '16 at 09:51

score 0 · Answer 2 · answered Mar 22 '16 at 09:43

0

You can use input of type number and step attribute:

<input type="number" step="1">

This way the input can only take integer values.

answered Mar 22 '16 at 09:43

Michał Miszczyszyn

11,835
2
35
53

Integer only input Javascript

2 Answers2