使用Jquery sortable禁用子表上的拖放

Question

我正在尝试在表行（tr）上执行拖放功能。我的表在主表（td）下面有子表。我已经使用Jquery UI进行排序，以便将其存档并且工作正常。 但我的子表（tr）也自动添加为拖放功能。我只需要在主桌上。

这是我的表格结构 -

<table id="mytable" class="grid">
    <thead>
        <tr><th class="index">No.</th><th>Year</th><th>Title</th><th>Group</th><th>Grade</th></tr>
    </thead>
    <tbody>
        <tr>
            <td class="index">1</td>
            <td>1969</td>
            <td>Slaughterhouse-Five</td>
            <td>Group</td>
            <td>A+</td>
        </tr>
        <tr>
            <td class="index">2</td>
            <td>1952</td>
            <td>Player Piano</td>
            <td>Group</td>
            <td>B</td>
        </tr>
        <tr>
            <td class="index">3</td>
            <td>1963</td>
            <td>Cat's Cradle</td>
            <td>Group</td>
            <td>A+</td>
        </tr>
        <tr>
            <td class="index">4</td>
            <td>1973</td>
            <td>Breakfast of Champions</td>
            <td>Group</td>
            <td>C</td>
        </tr>
        <tr>
            <td class="index">5</td>
            <td>1965</td>
            <td>God Bless You, Mr. Rosewater</td>
            <td>Group</td>
            <td>A</td>
        </tr>
        <tr>
            <td class="index">6</td>
            <td>1965</td>
            <td>God Bless You, Mr. Rosewater</td>
            <td>Group</td>
            <td>A</td>
        </tr>
        <tr>
            <td class="index">7</td>
            <td>1965</td>
            <td>
                <table>
                    <tr>
                        <td>Name1</td>
                        <td>Addrs1</td>
                        <td>phn1</td>
                    </tr>
                    <tr>
                        <td>Name2</td>
                        <td>Addrs2</td>
                        <td>phn2</td>
                    </tr>
                    <tr>
                        <td>Name3</td>
                        <td>Addrs3</td>
                        <td>phn3</td>
                    </tr>
                </table
            </td>
            <td>Group</td>
            <td>A</td>
        </tr>
    </tbody>
</table>

Jquery代码 -

$(function(){
    var fixHelperModified = function(e, tr) {
        var $originals = tr.children();
        var $helper = tr.clone();
        $helper.addClass('dragRow');
        $helper.children().each(function(index) {
            $(this).width($originals.eq(index).width());
            console.log($helper);
        });
        return $helper;
    };
    $("#mytable tbody").sortable({
        revert: true,
        start: function(e, ui){
            $(ui.placeholder).hide(300);
        },
        change: function (e,ui){
            $(ui.placeholder).hide().show(300);
        },
        cursor: "move",
        revert: 300,
        axis: "y",
        helper: fixHelperModified
    }).disableSelection();
});

我想在<td>下排除Child table sortable。任何协助将不胜感激。

https://jsfiddle.net/pLsk3tkx/1/