表列和JQuery Live Search的总和

Question

I've integrated the total sum for the table columns and it works great. The same page has a JQuery live search. When I do a search, the results appear just fine but the total sum is showing the total for all data not the filtered data by JQuery Search.

Now, we want the total sum to change upon doing a search to show only the filtered results. So on doing a search, table data will be filtered and accordingly, the total sum amounts will be recalculated based on the filtered results.

I've tried to disable the live search capability so the page will reload each time I do a search. And accordingly, the total sums will be recalculated. But I couldn't get it to work like this.

<script>
$(document).ready(function()
{
$('table thead th').each(function(i)
{
calculateColumn(i);
});
});
function calculateColumn(index)
{
var total = 0;
$('table tr').each(function()
{
var value = parseInt($('td', this).eq(index).text());
if (!isNaN(value))
{
total += value;
}
}); 
$('table tfoot td').eq(index).text('' + total);
}
</script>

<tfoot>
    <tr class="sum" height="50px">
        <td></td>
        <td></td>
        <td></td>
    </tr>
</tfoot>