jQuery tablesorter sorting not working
- by jknox
I'm using jQuery tablesorter plugin to generate dynamically a table from a csv file, and that part is working fine. However whenever i try to sort the table by clicking on the table headers, firebug reports this problem in the console:
parsers is undefined
return parsers[i].type;\n
Initially i though this problem was being caused by the table not being ready after the document loads, so i fixed that by manually calling tablesorter() after my table was rendered from the csv file. this didn't fix the issue though.
Also, at the very end of the table, the table is drawn garbled with some gray areas at the end. I suppose this is related to the error above.
The code in question is this:
<html>
<head>
<link rel="stylesheet" href="blue/style.css" type="text/css" />
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery.tablesorter.js"></script>
<script type="text/javascript" src="jquery.csv.js"></script>
<script type="text/javascript" id="js">
function sortThis() {
$("#myTable").tablesorter({
// sortList:[[0,0],[2,1]]
});
};
</script>
<title>huh!?</title>
</head>
<body>
<table id="myTable" class="tablesorter" cellspacing="1" cellpadding="0" border="0">
<thead>
<tr>
<th>name</th>
<th>type</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<script type="text/javascript">
$.get('myfile.csv', function(data) {
myfile = jQuery.csv()(data)
for (var x = 0; x < myfile.length; x++) {
str = "<tr>";
for (var y = 0; y < myfile[x].length; y++) {
str += "<td>" + myfile[x][y] + "</td>";
}
str += "</tr>";
$('#myTable').append(str);
}
});
sortThis();
</script>
</tbody>
</table>
</body>
</html>
Thanks in advance for your help.