如何在延迟加载的表上使用jQueryUI的可排序功能？

我需要创建一个表，该表使用延迟加载而不是分页来动态显示初始加载之外的内容，并通过jQueryUI的可排序功能进行排序

延迟加载是通过检查scrollTop和scrollHeight来确定用户离页面底部的距离来实现的。当它们足够接近时，我会调用AJAX来获取另一组数据，并将其作为表行附加到表的末尾

我在表上实现了jQuery UI sortable，但问题是它不允许我将TR拖过原始表中的最后一个TR。它记得哪个TR是最后一个孩子，然后阻止我超越那个

下次我尝试拖动TR时，它知道新的端点在哪里，但是当我加载更多时，我遇到了同样的问题

我想发生的是，当用户拖动一个TR时，表可以延迟加载一些新数据，用户可以继续拖动到新的数据集，因为它们必须不断地拖动才能再次开始拖动，这似乎有点不方便

我有一种感觉，这将需要对可排序函数中的代码进行根本性的更改，但我希望有人可能已经找到了解决这个问题的方法

---

更新：我尝试使用connectWith选项。我没有将动态加载的行添加到同一个TBODY中，而是将它们放在它们自己的TBODY中，该TBODY也是可排序的，并使用connectWith选项对所有TBODY元素设置新的和原始的TBODY。不幸的是，这并没有起到任何不同的作用。在删除TR后，我仍然可以在整个表中拖动，但不能在原始拖动上下文中拖动。这是令人沮丧的，因为它不是一个很好的用户体验。

我在一周前写了一篇文章-我自己的jQuery表分类器：asc/desc

function sortTableJquery()
 {
    var tbl =$("#tbl tr");
    var store = [];
    var sortElementIndex = parseFloat($.data(document.body, "sortElement"));

    for (var i = 0, len = $(tbl).length; i < len; i++)
    {
        var rowDom = $(tbl).eq(i);
        var rowData = $.trim($("td",$(rowDom)).eq(sortElementIndex).text());
          store.push([rowData, rowDom]);
    }
    store.sort(function (x, y)
    {
        if (x[0].toLowerCase() == y[0].toLowerCase()) return 0;
        if (x[0].toLowerCase() < y[0].toLowerCase()) return -1 * parseFloat($.data(document.body, "sortDir"));
        else return 1 * parseFloat($.data(document.body, "sortDir"));

    });
    for (var i = 0, len = store.length; i < len; i++)
    {
        $("#tbl").append(store[i][1]);
    }
    store = null;
 }

在加载新项目后，是否尝试调用您的排序表

$('#your-sortable').sortable('refresh');

---

在这里，一个jsfiddle将真的很有帮助=

Thaks获得响应！一般来说，让排序功能与表一起工作并没有问题。我的问题是能够根据滚动位置对动态加载额外数据的表进行排序。此功能也适用于现有数据和未来注入的数据…Hi@Royi。。。这看起来更像是一个通过按下按钮来调用的函数。还是我误解了？我正在寻找一种可以让我用鼠标上下拖动表格行，并在屏幕上动态查看排序情况的工具。谢谢你给了我一线希望我只是尝试实现它，但它根本没有改变行为。在我看来，在排序过程中调用刷新并不实际做任何事情。只要在其中得到一些代码，我就知道我能做些什么。目前的代码处理一些专有的东西，所以我不得不去掉一些东西-事实证明，我确实有我用来处理这些事情的原始概念验证代码。它的工作原理与我正在使用的屏幕非常相似，您肯定可以看到这个问题。在JSFIDLE中它看起来有点不稳定，但这里什么都没有。。。