使用 Jquery 从 html 表中拖放多行

Question

我正在尝试将多行从一个表拖放到另一个表中。请帮助我如何实现这一目标。请找到下面的小提琴链接（我从我们的论坛获取），

$(document).ready(function () {
    var $tabs = $('#table-draggable2')
    $("tbody.connectedSortable")
        .sortable({
            connectWith: ".connectedSortable",
            items: "> tr:not(:first)",
            appendTo: $tabs,
            helper: "clone",
            zIndex: 999990
        })
        .disableSelection();
    var $tab_items = $(".nav-tabs > li", $tabs).droppable({
        accept: ".connectedSortable tr",
        hoverClass: "ui-state-hover",
        drop: function (event, ui) {
            return false;
        }
    });
});

http://jsfiddle.net/balajipalamadai/t06m8ghb/

Answer 1

我自己找到了它，我刚刚修改了这个小提琴的 html http://jsfiddle.net/yf47u/以使其正常工作。我参考了这篇文章

请找到下面的工作小提琴链接，

http://jsfiddle.net/balajipalamadai/83k9k/47/

<div id="table1" class="bitacoratable">
   <table id="table1" class="childgrid">
      <tr class="draggable_tr">
         <td>1</td>
         <td>Student 1</td>
      </tr>
      <tr class="draggable_tr">
         <td>2</td>
         <td>Student 2</td>
      </tr>
      <tr class="draggable_tr">
         <td>3</td>
         <td>Student 3</td>
      </tr>
      <tr class="draggable_tr">
         <td>4</td>
         <td>Student 4</td>
      </tr>
      <tr class="draggable_tr">
         <td>5</td>
         <td>Student 5</td>
      </tr>
   </table>
</div>
<div id="table2" class="bitacoratable">
   <table id="table2" class="childgrid">
      <tr class="draggable_tr">
         <td>6</td>
         <td>Student 6</td>
      </tr>
      <tr class="draggable_tr">
         <td>7</td>
         <td>Student 7</td>
      </tr>
      <tr class="draggable_tr">
         <td>8</td>
         <td>Student 8</td>
      </tr>
      <tr class="draggable_tr">
         <td>9</td>
         <td>Student 9</td>
      </tr>
      <tr class="draggable_tr">
         <td>10</td>
         <td>Student 10</td>
      </tr>
   </table>
</div>

谢谢，巴拉吉