how to add integers in input type number?

Question

<input id='inpa' type='number' value=1>

js

var inp = $('#inpa').val();

$('#btnext').click(function(){
    $('#inpa').val(inp + 1);
    $('#inpa').val(inp += 1); // also tried
});

in both cases result is 11!

how can I get 2 ?

if you console.log `typeof(inp)` you will see that it is a string, so cast the `inp` to an integer and then do the +1 — Pierre, Feb 23 '18 at 12:46
Reading the value of an input always gives you a string. Always pass it through parseint, farsefloat, or even Number() if you expect a number — Emmanuel Delay, Feb 23 '18 at 12:48
you can find your answer here https://stackoverflow.com/questions/9227268/how-can-val-return-number — swetansh kumar, Feb 23 '18 at 12:49
@bonaca you have already been answered to that question. input values are always strings. That how it is meant to work. — Pierre, Feb 23 '18 at 12:49
Restricting the user to type only numbers. Not related to Javascript type. Html and javascript are to different things — Pierre, Feb 23 '18 at 18:57

score 1 · Answer 1 · answered Feb 23 '18 at 12:47

1

You have to parse them into numbers first:

var a = parseInt($('#inpa').val(), 10);

answered Feb 23 '18 at 12:47

SANM2009

1,439
2
10
25

score 1 · Accepted Answer · answered Feb 23 '18 at 12:48

The value of HTML inputs are always strings. You need to ‘parse’ the number as an integer.

parseint(inp)

will understand whatever inp is as an integer, which you can now +1 and -1 from.

When you set the value of the tag, it will change it back to a string for you.

score 1 · Answer 3 · answered Feb 23 '18 at 12:48

You have to convert string to number using Number or parseInt

$('#btnext').click(function() {
  var inp = Number( $('#inpa').val() ); /* Need to be inside the function, so that will get the updated value every user click*/
  $('#inpa').val(inp + 1);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id='inpa' type='number' value=1>
<input type="button" id="btnext" value="btnext">

score 1 · Answer 4 · answered Feb 23 '18 at 12:50

Your code concatenates strings.

You need to convert each variable to a number by calling parseFloat() around each one.

$('#btnext').click(function(){
   var inp = $('#inpa').val();
    $('#inpa').val(parseInt(inp) + 1);
   // $('#inpa').val(inp += 1); // also tried
});

how to add integers in input type number?

4 Answers4