使用 ajax 和动态 thead 和 tbody 部分的 JQuery 表排序器答案

【问题标题】：JQuery tablesorter using ajax and dynamic thead and tbody sections使用 ajax 和动态 thead 和 tbody 部分的 JQuery 表排序器
【发布时间】：2013-11-29 01:52:56
【问题描述】：

我正在尝试使用 jquery tablesorter 插件将一些表格排序添加到使用 dojo 的 Rally 应用程序中，努力解决如何连接 tablesorter 的更新回调。

我的 html 看起来像这样（thead 和 tbody 是分开的，因为它们是动态生成的，即预先不知道列数）：

<table id='myTable' class='tablesorter'>
    <thead id='sort-head'></thead>
    <tbody id='sort-body'></tbody>
</table>

tablesorter 初始化在这里

<script type="text/javascript">
    function onLoad() {
        var appCustom = new ReleaseScopeChange();
        appCustom.display(dojo.body());
    }
    rally.addOnLoad(onLoad);
    $(document).ready(function(){$("#myTable").tablesorter();});      
</script>

更新thead/tbody的代码

dojo.byId("sort-head").innerHTML = headresults; 
dojo.byId("sort-body").innerHTML = bodyresults; 
$('#myTable').trigger("update");

现在，排序根本没有真正设置。如果我添加一个静态表，我可以让排序工作完美，所以我假设它与 ajax 请求和更新触发器之间的时间有关。

我已经查看了很多关于此的其他答案，但我真的不确定缺少什么。

【问题讨论】：

你不要像这里tablesorter.com/docs/example-ajax.html那样在ajax回调中使用$('#myTable').trigger("update")吗？

标签： jquery ajax dojo rally tablesorter

【解决方案1】：

如果您使用的是原始表格排序器，最好只删除并替换整个表格，而不是单独更新 thead & tbody html；然后在新表上重新初始化 tablesorter。

或者你可以disable tablesorter，然后重新初始化它。

如果您使用我的fork of tablesorter，请使用updateAll method 而不是update。

dojo.byId("sort-head").innerHTML = headresults; 
dojo.byId("sort-body").innerHTML = bodyresults; 
$('#myTable').trigger("updateAll");

【讨论】：