2

I am trying to get sum of rows of my table:

td1 val = $5,000.00; td2 val = $3000.00;

And I am using the following code:

var totalnum = 0;
$('.num').each(function(){
  totalnum+= parseFloat($(this).html());
});
$('.total_num').html(totalnum);

This code works perfect if I remove money formatting from the number, otherwise it gives NaN as a result even if I am using parseFloat.

What am I missing?

Ben Everard
  • 13,652
  • 14
  • 67
  • 96
seoppc
  • 2,766
  • 7
  • 44
  • 76

3 Answers3

4

Try:

var totalnum = 0;
$('.num').each(function(){
   totalnum+= parseFloat($(this).html().substring(1).replace(',',''));
});
$('.total_num').html('$' + totalnum);

This will remove the $ (or whatever currency symbol) from the beginning and all commas before doing the parseFloat and put it back for the total.

Alternatively you could use the jQuery FormatCurrency plugin and do this:

totalnum+= $(this).asNumber();
Richard Dalton
  • 35,513
  • 6
  • 73
  • 91
  • please check this again, if there is any mistake... `totalnum+= parseFloat($(this).html().substring(1).replace(',','');` – seoppc Sep 16 '11 at 08:15
  • What if the value is formatted using european notation `1.000,00`? – Pekka Sep 16 '11 at 08:22
  • yes i am using jquery format currency, right i could use simply `.asNumber` function. sorry and thanks for help. – seoppc Sep 16 '11 at 08:23
  • @Pekka It's not in the example and that's what we are going by. Anyway, the formatCurrency plugin can handle that. – Richard Dalton Sep 16 '11 at 08:27
3

If you add $ to the value, it is no longer an integer, and can no longer be calculated with.

Trying to make the formatted value back into a number is a bad idea. You would have to cater for different currency symbols, different formattings (e.g. 1.000,00) and so on.

The very best way would be to store the original numeric value in a separate attribute. If using HTML 5, you could use jQuery's data() for it:

<td class="num" data-value="1.25">$1.25</td>
....

var totalnum = 0;
$('.num').each(function(){
  totalnum+= parseFloat($(this).data("value"));
});
$('.total_num').html(totalnum);

this way, you separate the formatted result from the numeric value, which saves a lot of trouble.

Pekka
  • 442,112
  • 142
  • 972
  • 1,088
1

Try removing $ and any other character not part of the float type:

var totalnum = 0;

$('.num').each(function(){
    var num = ($(this).html()).replace(/[^0-9\.]+/g, "");
    totalnum+= parseFloat(num);
});

$('.total_num').html(totalnum);

Edit: updated replace to remove all non-numerical characters (except periods) as per this answer.

Community
  • 1
  • 1
Chad Levy
  • 10,032
  • 7
  • 41
  • 69
  • thanks, and what about commas, how can i strip those before calculation? – seoppc Sep 16 '11 at 08:10
  • What if the data is in Euros? Or Yen? – Pekka Sep 16 '11 at 08:11
  • You can use the same method to remove any other characters you like: `.replace("$", "").replace(",", "").replace("¥", "");`. There are far more efficient methods of doing this, though. – Chad Levy Sep 16 '11 at 08:14
  • @Paperjam the vastly superior approach would be storing the original numeric value in a separate place so one doesn't have to fiddle with it at all. That way, you are safe against yet another currency coming into the equation, or `number_format()` formatting the number in european notation (`1.000,00`), breaking the code later – Pekka Sep 16 '11 at 08:16
  • @Pekka - True, I didn't think about his original question. If he has access to the original, unformatted values, then he should use those values in his aggregation. As an aside, if he still wanted to use the method he's already using, this answer might help remove unwanted characters: http://stackoverflow.com/questions/559112/how-to-convert-a-currency-string-to-a-double-with-jquery-or-javascript/559178#559178 – Chad Levy Sep 16 '11 at 08:19