How to force addition instead of concatenation in javascript [duplicate]

Question

I'm trying to add all of the calorie contents in my javascript like this:

$(function() {     var data = [];      $( "#draggable1" ).draggable();     $( "#draggable2" ).draggable();     $( "#draggable3" ).draggable();      $("#droppable_box").droppable({         drop: function(event, ui) {             var currentId = $(ui.draggable).attr('id');             var total = 0;             data.push($(ui.draggable).attr('id'));              if(currentId == "draggable1"){             var myInt1 = parseFloat($('#MealplanCalsPerServing1').val());             }             if(currentId == "draggable2"){             var myInt2 = parseFloat($('#MealplanCalsPerServing2').val());             }             if(currentId == "draggable3"){             var myInt3 = parseFloat($('#MealplanCalsPerServing3').val());             }         if ( typeof myInt1 === 'undefined' || !myInt1 ) {         myInt1 = parseInt(0);         }         if ( typeof myInt2 === 'undefined' || !myInt2){         myInt2 = parseInt(0);         }         if ( typeof myInt3 === 'undefined' || !myInt3){         myInt3 = parseInt(0);         }         total = parseFloat(myInt1 + myInt2 + myInt3);         $('#response').append(total);         }     });     $('#myId').click(function(event) {         $.post("process.php", ({ id: data }), function(return_data, status) {             alert(data);             //alert(total);         });     }); }); 

Instead of adding the variables they get concatenated. I've tried using parseInt, parseFloat, and Number but I still just get concatenation and not addition. Please look at the view source at http://maureenmoore.com/momp_112412/121912_800.html

Answer 1

Your code concatenates three strings, then converts the result to a number.

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

total = parseFloat(myInt1) + parseFloat(myInt2) + parseFloat(myInt3);