Question

Why would this not show #total as a decimal?
The value of the inputs in class=”total” are a function result that stores the value in 2 decimal format. The function to display the row totals works fine but when I use the below code to total the rows when the qty field changes, the mat is correct and the change takes place correctly, but it in an int style not a currency format (2 decimal places). I have tried toPrecision as well with no change.

$('[name^=qty]').change(function(){
    var sum = 0;
    $('input.total').each(function() {
        sum += $(this).val();
    });

    $('#total').val(sum).toFixed(2);
    });

Here is the code that totals each row

function Tot(x,price,y) {
var total = CurrencyFormatted(x*price);
var v = document.getElementById(y);
v.setAttribute('value',total);}

All of these functions run just fine, totaling correctly and updating as expected, with exception to the decimal places in the grand total field.

Below is the html that I am using for each row and then the total

<td>$<input id="t1" disabled="disabled" size="8" value="0.00" class="total" />
...
<input disabled="disabled" id="total" name="total" size="8" value="0.00" />

There is nothing in the css that would change the format of the number either in the class or the table structure. I am at a complete loss, but hopefully someone will see something I don’t. Thank you in advance.

Answer 1

$('input.total').each(function() {
    sum += parseFloat( $(this).val() );
});

$('#total').val( sum.toFixed(2) );

EDIT, since i was busy i didn’t explain my answer, Greg Pettit did, so here’s the explanation

You were trying to chain toFixed() to something that’s not a number. Also, you weren’t converting your retrieved values to floats. JS may have handled the latter, but better to run it through parseFloat as per sample