为什么 AJAX 响应不是可排序的答案

【问题标题】：Why AJAX response is not in sortable manner为什么 AJAX 响应不是可排序的
【发布时间】：2014-08-14 16:54:07
【问题描述】：

我正在使用sorttable.js进行表格排序，我的表格每 3 秒通过 ajax 响应更新一次，但响应没有按照我预期的方式排序。

索引页面

 <div id="resDiv">
            <table id="myTable1" class="sortable">
            <thead>
                <tr><th id="person">Person</th><th id="monpay">Monthly pay</th></tr>
            </thead>
            <tbody>
                <tr><td>Jan Molby</td><td>£12,000</td></tr>
                <tr><td>Steve Nicol</td><td>£8,500</td></tr>
                <tr><td>Steve McMahon</td><td>£9,200</td></tr>
                <tr><td>John Barnes</td><td>£15,300</td></tr>
            </tbody>
            <tfoot>
                <tr><td>TOTAL</td><td>£45,000</td></tr>
            </tfoot>
        </table>
        </div>
         <a href="#" id="ajax-append">Append new table data</a>

ajax 响应是：

<table id="myTable" class="sortable">
    <thead>
        <tr><th>Person</th><th>Monthly pay</th></tr>
    </thead>
    <tbody>
        <tr><td>prabha Molby</td><td>£12,000</td></tr>
        <tr><td>abcd Nicol</td><td>£8,500</td></tr>
        <tr><td>steev McMahon</td><td>£9,200</td></tr>
        <tr><td>John Barnes</td><td>£15,300</td></tr>
    </tbody>
    <tfoot>
        <tr><td>TOTAL</td><td>£55,000</td></tr>
    </tfoot>
</table>

JavaScript

 $(function() {

                $("#ajax-append").click(function() {
                    setInterval(function() {
                    var request = $.get("assets/replacecontent.jsp", function(html) {
                        alert(html);
                        $('#resDiv').html(html);
                        var newTableObject = document.getElementById("myTable");
                        alert(newTableObject);
                        sorttable.makeSortable(newTableObject);

//                        alert($("#myTable").length);

                    });
                }, 3000);

                });
            });

现在，如果我对 ajax 响应进行排序，它会被排序，但在另一个响应之后，它会再次更改它的顺序，但我希望它像前一个一样排序。

【问题讨论】：

好吧，你用一个新的、未排序的表替换已排序的表。你还期待什么？
@Bergi 但我使用 makeSortable() 方法在我的 js 中对新表进行排序
方法名称makeSortable 听起来好像它使新表可排序，但不对其进行排序。反正它也不知道上一张表的排序标准。
@Bergi 我从这个link 中读到这个方法对表格进行排序
嗯，那么该页面上的措辞令人困惑。请参阅下面的kryogenix.org/code/browser/sorttable/#externalcall 和@AlexanderKludt 的回答。

标签： javascript jquery ajax sorttable.js

【解决方案1】：

我认为您应该阅读 sorttable.js 常见问题解答中所说的内容：

页面加载时对表格进行排序

很多人问，“我如何让 sorttable 先排序表页面加载的时间？”答案是：你没有。Sorttable 是关于在没有页面的情况下更改从您的服务器提供的 HTML 刷新。当页面首次从服务器提供时，您必须无论如何都要等待它送达。所以，如果你想要这张桌子首次显示页面时排序，以排序的方式提供表格命令。表通常来自数据库；从在 SQL 中使用 ORDER BY 子句按排序顺序排列数据库。任何涉及您在页面上立即运行 sorttable 的解决方案加载（即，没有用户输入）是错误的解决方案。

但他们也声明了solution for that：

//Find the TH you want to use, maybe you can store that using an event handler before
var myTH = document.getElementsByTagName("th")[0];
//Then sort it
sorttable.innerSortFunction.apply(myTH, []);

但是，您必须找到您的用户之前点击过的列，老实说，我还没有找到任何直接使用 sorttable api 的方法。也许使用某种点击事件处理程序并存储最后点击的 th。

【讨论】：