jQuery Sortable 将我的 从我的 中移出？

Question

如果你想看看发生了什么，这是我的 JSfiddle:

http://jsfiddle.net/qjADE/

我的 HTML 在初始加载时看起来像这样:

<table class="sorted_table">
  <thead>
    ...
  </thead>
  <tbody>
    <tr id="1" class="homepage-slide-data admin-homepage-slide-list">...</tr>
    <tr id="2" class="homepage-slide-data admin-homepage-slide-list">...</tr>
  </tbody>
</table>

注意我有两个 <tr>...</tr>

没问题。但是，如果我将顶部 (tr#1) 拖到底部，并尝试将新顶部(现在是 tr#2，因为顺序切换)拖到底部，它就会停止工作。我检查了 HTML，看起来多次将顶部拖动到底部做了两件事(不需要的):

1. 占位符保留在底部，不再更新/移动。

2. 如果您打开 Firebug 并观看 html，您会看到 </tbody>被推高，这样<tr> s 不再被 <tbody>...</tbody> 包围:

   #... ...

这是我用于自定义 jquery 可排序的 JS:

$('.sorted_table').sortable({
    containerSelector: 'table',
    itemPath: '> tbody',
    itemSelector: 'tr.admin-homepage-slide-list',
    placeholder: '<li class="placeholder"/>', #<-- I tried tr instead of li too, same result
    pullPlaceholder: true,
    onDrop: function () {
        var id_list = new Array();
        $('.sorted_table tr.homepage-slide-data').each(function(index) {
            id_list[index] = $(this).attr("id");
        });
        jQuery.ajax({
            url: '/admin/homepage_slides/update_order',
            type: 'POST',
            data: {"new_order": id_list},
            dataType: 'script'
        });
    }
})

附注我愿意尝试其他插件。如果您知道任何具有类似表行排序功能的东西，请告诉我。

Answer 1

我最终切换到这个:http://isocra.com/2008/02/table-drag-and-drop-jquery-plugin/