Why won't my inputs value sum?

Question

Im trying to do a sum of values i get from id but it keeps appending second value to first instead of doing sum as it should.

Example 23+25=2325

Heres my code:

This is the code im using to sum.

        $('input').blur(function() {
            for (var i=1; i<=value; i++) {

              var one = document.getElementById("veb_blocos-"+i).value; 
              var two = document.getElementById("veb_pellet-"+i).value;
              var sum1 = one+two;
              document.getElementById("total1-"+i).value = sum1; 
           };

        });

[TIP] When posting this kind of question, please create a fiddle http://jsfiddle.net to help us creating an easier/faster resolution. — axcdnt, Jul 27 '12 at 18:07
[Addition vs. Concatenation](http://jqfundamentals.com/#example-2.8) — jbabey, Jul 27 '12 at 18:11
Related: [why do I get 24 when adding 2 + 4 in javascript](http://stackoverflow.com/questions/1225161/why-do-i-get-24-when-adding-2-4-in-javascript) — Felix Kling, May 24 '14 at 08:45

score 7 · Answer 1 · edited Jul 27 '12 at 18:05

7

Try this:

var one = parseInt(document.getElementById("veb_blocos-"+i).value, 10); 
var two = parseInt(document.getElementById("veb_pellet-"+i).value, 10);

edited Jul 27 '12 at 18:05

Madara's Ghost

172,118
50
264
308

answered Jul 27 '12 at 18:03

dfsq

191,768
25
236
258

Yes it worked great. Just one question. When i insert only one input it gives on input total this value "NaN" . Thank you very much – João Costa Jul 27 '12 at 18:08
3

@jonny: Because `parseInt("", 10)` is `NaN` and so the overall result will be `NaN`. If you use the unary plus operator (`+variable`) you don't have that problem, since `+"" === 0`. – Felix Kling Jul 27 '12 at 18:10

score 3 · Accepted Answer · answered Jul 27 '12 at 18:04

Because the value of an input is a string. Cast it to int.

$('input').blur(function() {
    for (var i=1; i<=value; i++) {

      var one = document.getElementById("veb_blocos-"+i).value; 
      var two = document.getElementById("veb_pellet-"+i).value;
      var sum1 = parseInt(one,10)+parseInt(two,10);
      document.getElementById("total1-"+i).value = sum1; 
   };

});

score 2 · Answer 3 · answered Jul 27 '12 at 18:17

Here is the safest possible solution (presuming the requested DOM nodes are present):

$('input').blur(function () {
    var i = 0,
        one = 0,
        two = 0;
    for (i = 1; i <= value; i += 1) {
        one = Number(document.getElementById("veb_blocos-" + i).value);
        two = Number(document.getElementById("veb_pellet-" + i).value);
        if (isNaN(one)) {
            one = 0;
        }
        if (isNaN(two)) {
            two = 0;
        }
        document.getElementById("total1-" + i).value = one + two;
    };
});

score 1 · Answer 4 · answered Jul 27 '12 at 18:03

Try:

$('input').blur(function() {
            for (var i=1; i<=value; i++) {

              var one = parseInt(document.getElementById("veb_blocos-"+i).value); 
              var two = parseInt(document.getElementById("veb_pellet-"+i).value);
              var sum1 = one+two;
              document.getElementById("total1-"+i).value = sum1; 
           };

        });

score 1 · Answer 5 · answered Jul 27 '12 at 18:05

It's because your values are string datatypes instead of a number type. You'll need to parse them first.

$('input').blur(function() {
            for (var i=1; i<=value; i++) {

              var one = parseFloat(document.getElementById("veb_blocos-"+i).value); 
              var two = parseFloat(document.getElementById("veb_pellet-"+i).value);
              var sum1 = one+two;
              document.getElementById("total1-"+i).value = sum1; 
           };

        });

Why won't my inputs value sum?

5 Answers5

Linked

Related