Jquery UI可排序行范围表内问题

我正在使用jQueryUI排序小部件对表行进行排序。我有简单的行和行组在我的表中，我使用了rowspan来完成行的分组

简单行：吉尔，史密斯，50 一组人：伊芙，杰克逊，94岁

简单的排序非常有效，但当我尝试拖动包含一组行的行时，它不起作用。我需要一些输入来知道我在拖动行组时出错的地方

检查我的Js小提琴：

我已经编写了下面的代码，以便在我的代码中启用排序

var fixHelper = function (e, ui) { ui.children().each(function () 
{
 $(this).width($(this).width()); }); return ui; 
};
$("#t01 tbody").sortable({ helper: fixHelper }).disableSelection();

我需要你在我出错的地方提供意见

---

我看了一下，在为第2列和第3列创建了四行的行创建了两个嵌套表之后，我成功地使它工作起来

<table id="t01" style="width: 100%;" border="1">
    <tbody class="ui-sortable">
        <tr class="ui-sortable-handle">
            <td>Jill</td>
            <td><div class="columnMargin">Smith</div></td>
             <td><div class="columnMargin">50</div></td>
        </tr>
        <tr class="ui-sortable-handle" data-multiple="true">
            <td>Eve</td>
            <td>
                <table class="multipleRows">
                    <tr>
                        <td style="border-style:solid">Jackson</td>
                    </tr>
                    <tr>
                        <td style="background-color: lightblue;">
                            <input name="cell1" type="text">
                        </td>
                    </tr>
                    <tr>
                        <td style="background-color: lightblue;">
                            <input name="cell1" type="text">
                        </td>
                    </tr>
                    <tr>
                        <td style="background-color: lightblue;">
                            <input name="cell2" type="text">
                        </td>
                    </tr>
                </table>
            </td>
            <td>
                <table class="multipleRows">
                    <tr>
                        <td style="border-style:solid">94</td>
                    </tr>
                    <tr>
                        <td style="background-color: lightblue;">
                            <input name="cell1" type="text">
                        </td>
                    </tr>
                    <tr>
                        <td style="background-color: lightblue;">
                            <input name="cell1" type="text">
                        </td>
                    </tr>
                    <tr>
                        <td style="background-color: lightblue;">
                            <input name="cell2" type="text">
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr class="ui-sortable-handle">
            <td>Jill</td>
            <td><div class="columnMargin">Smith</div></td>
            <td><div class="columnMargin">50</div></td>
        </tr>
        <tr class="ui-sortable-handle">
            <td>Eve</td>
            <td><div class="columnMargin">Jackson</div></td>
            <td><div class="columnMargin">94</div></td>
        </tr>
    </tbody>
</table>

---

我想CSS样式仍有一些微调，但可排序部分仍在工作。因此，我希望您能找到它：-）

可能是您需要将“Eve”行和其他三行（作为第一列）隐藏在一个表行中，这意味着您需要将所有这些放在另一个表中。这三行好像没有被jQueryUI识别出来。我不是jQueryUI专家，所以我不能100%确定可排序函数有什么限制。祝你好运，谢谢Jyrkim。。。谢谢你的帮助。。。我们能帮我解决这个问题吗！！！

 $(document).ready(function () {
     $("#t01 tbody").sortable({
         items: ".ui-sortable-handle"
     }).disableSelection();
 });