Menu
On a web page that has a table that is being sorted by jQuery's tablesorter, there is functionality to add columns to the table dynamically. When this happens I call trigger("update") and trigger("appendCache") to get tablesorter to be able to sort by the new column (I have also tried calling tablesorter() again). However, the widgets for sorting do not appear in the new column(s) until I click in the header cells.
My question is does anybody know how to get the widgets to appear immediately? Thanks Regards Jason
580
<head>
<title>jQuery plugin: Tablesorter 2.0</title>
<link rel="stylesheet" href="css/jq.css" type="text/css" media="print, projection, screen" />
<link rel="stylesheet" href="../themes/blue/style.css" type="text/css" media="print, projection, screen" />
<script type="text/javascript" src="../jquery-latest.js"></script>
<script type="text/javascript" src="../jquery.tablesorter.js"></script>
<script type="text/javascript">
$(function() {
$(document).ready(function()
{
$("#myTable").tablesorter();
}
);
});
function append(){
var table = $("#myTable");
$(table).remove();
var tr = $("<tr></tr>");
$("<td></td>").html('Test').appendTo(tr);
$("<td></td>").html('test').appendTo(tr);
$("<td></td>").html('[email protected]').appendTo(tr);
$("<td></td>").html('$5.00').appendTo(tr);
$("<td></td>").html('http://www.test.com').appendTo(tr);
$(tr).appendTo(table);
$(table).appendTo($('#tableholer'));
$("#tableholer table").tablesorter();
}
</script>
</head>
<body>
<div id="tableholer">
<table id="myTable" class="tablesorter">
<thead>
<tr>
<th>Last Name</th>
<th>First Name</th>
<th>Email</th>
<th>Due</th>
<th>Web Site</th>
</tr>
</thead>
<tbody>
<tr>
<td>Smith</td>
<td>John</td>
<td>[email protected]</td>
<td>$50.00</td>
<td>http://www.jsmith.com</td>
</tr>
<tr>
<td>Bach</td>
<td>Frank</td>
<td>[email protected]</td>
<td>$50.00</td>
<td>http://www.frank.com</td>
</tr>
<tr>
<td>Doe</td>
<td>Jason</td>
<td>[email protected]</td>
<td>$100.00</td>
<td>http://www.jdoe.com</td>
</tr>
<tr>
<td>Conway</td>
<td>Tim</td>
<td>[email protected]</td>
<td>$50.00</td>
<td>http://www.timconway.com</td>
</tr>
</tbody>
</table>
</div>
<input type="button" onclick="append()" value="append"/>
</body>
In case of append this would work. in case of delete try same though i am never sure
125
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
