Question

这里生成一个带复选框的表。

<table id="sortable">
    <tr class="myDragClass"><td><input type="checkbox" />row 1</td><td>text text text</td></tr>
    <tr class="myDragClass"><td><input type="checkbox" />row 2</td><td>text text text</td></tr>
    <tr class="myDragClass"><td><input type="checkbox" />row 3</td><td>text text text</td></tr>
    <tr class="myDragClass"><td><input type="checkbox" />row 4</td><td>text text text</td></tr>
    <tr class="myDragClass"><td><input type="checkbox" />row 5</td><td>text text text</td></tr>    
</table>

这是我的java脚本代码：

  $(function () {
    $('#sortable tr').draggable({
        helper: function () {
            var selected = $('#sortableinput:checked').parents('tr');
            if (selected.length === 0) {
                selected = $(this);
            }
            var container = $('<div/>').attr('id', 'sortable');
            container.append(selected.clone());
            return container;
        }
    });

    $('#sortable').droppable({

        tolerance: 'pointer',
        drop: function (event, ui) {
            debugger;
            // $(this).append(ui.helper.children());
            var _GetVal = ui.helper.children();
            alert(ui.helper.children());
        }
    });

});

这里完成了选择和移动但是正在移动它将移动的记录添加到最后位置。但我想移动特定的位置 `

这里使用复选框选择多行，我想一次移动多行。像（2＆amp; 3）一样。所以这是我的行顺序像1,4,5,2,3.i想要移动（意味着拖放）同一个表中的行

Answer 1

由于您使用的是jQueryUI，为什么不使用“可排序的”＃39;对于桌子？

$("#sortable tbody").sortable({
}).disableSelection();

这是一个工作示例： http://bootply.com/60250

Answer 2

为每一行指定id，并尝试类似的东西，你可以使用循环结构输入2＆amp; 3

$("#sortable#" + id).appendTo("#sortable");

选择表格中的多行并拖放放在同一张桌子上

2 个答案: