对具有多个 tbody 的表进行排序？

Question

我有一个表结构如下。现在我需要分别对这些嵌套表进行排序。例如：对章节的行进行排序只会更新单独表中的章节顺序。然而，对项目进行排序将更新它们在另一个表中的顺序。

我设法设置代码和排序。但是，当我从第 4 章中拖动项目时，它会传递第 1 章中项目的顺序，因为它们位于第 4 章之前？？？

有人可以帮我仅对相关项目进行排序吗？

注意：此列表是来自数据库的动态列表。所以我对涵盖所有排序位的一个jquery代码感兴趣。

        <table id=subsortsortable>
        <tbody class=content>
            <tr id="chapter_1"><td>Chapter one</td></tr>
            <tr id="chapter_2"><td>Chapter two</td></tr>
            <tr id="chapter_3">
                <td>
                    <table>
                        <tbody class=subcontent>
                            <tr id="item_31"><td>three.one</td></tr>
                            <tr id="item_32"><td>three.two</td></tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr id="chapter_4">
                <td>
                    <table>
                        <tbody class=subcontent>
                            <tr id="item_41"><td>four.one</td></tr>
                            <tr id="item_42"><td>four.two</td></tr>
                            <tr id="item_43"><td>four.three</td></tr>
                            <tr id="item_44"><td>four.four</td></tr>
                            <tr id="item_45"><td>four.five</td></tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr id="chapter_4"><td>Chapter Four</td></tr>
        </tbody>
    </table>

我使用的代码如下：

//for sorting chapters - which is outer table
$("#subsortable tbody.content").sortable({      
        opacity: 0.7, 
        cursor: 'move', 
        placeholder: "ui-state-highlight",
        forcePlaceholderSize: true,
        update: function(){
            var order = $('#subsortable tbody.content').sortable('serialize') + '&action=updateChaptersOrder';
            $.post("/admin/ajax/ajax_calls.php", order, function(theResponse){
            });

        }

    });

// For sorting and updating items within a specific chapter - which is nested tbody
$("tbody.sortItems").subcontent({

        opacity: 0.7, 
        cursor: 'move', 
        placeholder: "ui-state-highlight",
        forcePlaceholderSize: true,
        update: function(){
            var order = $('tbody.subcontent').sortable('serialize');// + '&action=updateListings';
            $.post("/admin/ajax/ajax_calls.php", order, function(theResponse){
            });

        }

    });

Answer 1

我已经得到了我自己问题的答案..以防其他人遇到同样的问题。我已将内部表中的以下代码更改

var order = $('tbody.subcontent').sortable('serialize'); 

为

var order = $(this).sortable('serialize');