JQuery tablesorter using ajax and dynamic thead and tbody sections

偶尔善良 提交于 2020-01-04 06:28:27

问题


I am attempting to add in some table sorting using the jquery tablesorter plugin to a Rally app using dojo, struggling with how to hook up the update callback for the tablesorter.

I have html that looks like this (thead and tbody are separated as they are being dynamically generated i.e. number of columns is not known in advance):

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

tablesorter init is here

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

Code updating the thead/tbody

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

Now, the sorting never actually gets set up at all. If I add a static table I can get the sorting working perfectly, so I am assuming its related to timing between the ajax request and the update trigger.

I have looked through a lot of other answers on this and I'm really not sure what is missing.


回答1:


If you are using the original tablesorter, it would be better to just remove, and replace the entire table instead of updating the thead & tbody html separately; then reinitialize tablesorter on the new table.

Or you could disable tablesorter, then reinitialize it.

If you are using my fork of tablesorter, use the updateAll method instead of update.

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


来源:https://stackoverflow.com/questions/20257818/jquery-tablesorter-using-ajax-and-dynamic-thead-and-tbody-sections

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!