jquery - select multiple rows in a table and drag & drop in same table

Question

here am generating one table with checkboxes.

<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>

this is my java script code:

  $(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());
        }
    });

});

here am done selecting and moving but whn am moving its adding moved records to last position. but i want to move perticular position `

Here am selecting multiple rows using checkboxes and i want to move multiple rows at a time. like (2&3) to last. so this is my rows order like 1,4,5,2,3.i want to move(means drag n drop) the rows in same table

Answer 1

既然您使用的是 jQueryUI，为什么不对表格使用“可排序”？

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

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

Answer 2

为每一行指定 id，并尝试类似的方法，您可以使用循环结构输入 2&3

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