Menu
I'm having a couple of problems with the JQuery tablesorter plugin. If you click on a column header, it should sort the data by this column, but there are a couple of problems:
Regarding (2), I can't easily move the total row to a table footer, because the HTML is generated by the displaytag tag library over which I have limited control.
Regarding (1), I don't understand why the sort doesn't work as I've used exactly the same JavaScript shown in the simplest example in the tablesorter tutorials.
In fact, there's only a single line of JS code, which is:
<body onload="jQuery('#communityStats').tablesorter();">
Thanks in advance, Don
599
The first problem is due to the fact that the table sorter auto detects the column to a 'text'-column (probably because the empty cells). To solve this use this code to initialize the tablesorter and set all the field to either digit or currency depending on the data:
<script type="text/javascript" >
jQuery(document).ready(function()
{
jQuery("#communityStats").tablesorter({
headers: { 2: { sorter:'digit' } ,
3: { sorter:'digit' } ,
4: { sorter:'digit' } ,
5: { sorter:'digit' } ,
6: { sorter:'digit' } ,
7: { sorter:'digit' } ,
8: { sorter:'currency' } ,
9: { sorter:'currency' } ,
10: { sorter:'currency' } ,
11: { sorter:'currency' }
}
});
});
</script>
I would suggest using some Javascript to remove the last row from the table. Add a footer and then re-add the removed row from the table. To solve the issue with empty data in a numeric cell you may need to add your own custom parser.
$(function() {
$('#communityStats').append("<tfoot></tfoot>");
$('#communityStats > tr:last').remove()
.appendTo('#communityStats > tfoot');
$('#communityStats').tablesorter();
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
