Formatting Numbers After Filter (Summation)

mcarlotta

I am running into a strange event.

I am currently summing up certain columns. On initialization, the sums add up but have no formatting to them (IE: 4500).

However, when I filter, all of a sudden the summation columns (in my footer) format correctly (IE $4,500.00)

How can I solve this?

[code]
$(document).ready(function() {
var oTable = $('#locations_list').dataTable(

{
"aaSorting": [[0,'asc']],
"oLanguage": {"sSearch": "Search Locations:"},
"fnDrawCallback": function( oSettings ) {
$('').addClass("");
},
"footerCallback": function ( row, data, start, end, display ) {
var api = this.api();
// Remove the formatting to get integer data for summation
var intVal = function ( i ) {
return typeof i === 'string' ?
i.replace(/[\$,]/g, '')*1 :
typeof i === 'number' ?
i : 0;
};

// Total Spots
var spotTotal = api
.column( 5, { page: 'current'} )
.data()
.reduce( function (a, b) {
return intVal(a) + intVal(b);
} );

// Total Dec
var decTotal = api
.column( 6, { page: 'current'} )
.data()
.reduce( function (a, b) {
return intVal(a) + intVal(b);
} );

// Total OOH
var oohTotal = api
.column( 7, { page: 'current'} )
.data()
.reduce( function (a, b) {
return intVal(a) + intVal(b);
} );

// Total Rate Card
var ratecardTotal = api
.column( 8, { page: 'current'} )
.data()
.reduce( function (a, b) {
return intVal(a) + intVal(b);
} );

// Update footer
$( api.column( 5 ).footer() ).html(spotTotal);
$( api.column( 6 ).footer() ).html(decTotal);
$( api.column( 7 ).footer() ).html(oohTotal);
$( api.column( 8 ).footer() ).html(ratecardTotal);
},

}

).columnFilter(
{aoColumns:[
{ sSelector: "#locationFilter", type:"select" },
{ sSelector: "#skuFilter", type:"select" },
null,
{ sSelector: "#vendorFilter", type:"select"},

]}
);


}

);


[/code]