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; 
           };

        });

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; 
           };

        });

• javascript

Share Improve this question Follow edited May 24, 2014 at 8:45 Felix Kling 818k181181 gold badges1.1k1.1k silver badges1.2k1.2k bronze badges asked Jul 27, 2012 at 18:01 João CostaJoão Costa 51922 gold badges77 silver badges2020 bronze badges 3

• [TIP] When posting this kind of question, please create a fiddle jsfiddle to help us creating an easier/faster resolution. – axcdnt Commented Jul 27, 2012 at 18:07
• Addition vs. Concatenation – jbabey Commented Jul 27, 2012 at 18:11
• Related: why do I get 24 when adding 2 + 4 in javascript – Felix Kling Commented May 24, 2014 at 8:45

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 7

Try this:

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

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; 
   };

});

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;
    };
});

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; 
           };

        });

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; 
           };

        });