如何在两个容器

时间:2016-09-13 10:31:10

标签: jquery jquery-ui jquery-ui-draggable jquery-ui-sortable

我有两个表名表1 表2 ,每个表包含两行。

我能够在同一个表中拖放元素

请问您能告诉我是否可以将表行从表1拖放到表2,反之亦然(在不同表中移动行)

这是我的两个表的HTML

<h2>Table 1:</h2>
        <div id="table1" >
            <table>
                <tbody>
                    <tr>
                        <td>Table 1 First Row</td>
                    </tr>
                    <tr>
                        <td>Table 1 Second Row</td>
                    </tr>
                </tbody>
            </table>
        </div>
 <hr/>
    <h2>Table 2:</h2>
   <div id="table2">
            <table>
                <tbody>
                    <tr>
                        <td>Table 2 First Row</td>
                    </tr>
                    <tr>
                        <td>Table 2 Second Row</td>
                    </tr>
                </tbody>
            </table>
        </div>

和我的js代码

$("tbody").sortable({

});

这是我的小提琴

https://jsfiddle.net/wdy1ty89/7/

1 个答案:

答案 0 :(得分:3)

来自 jQuery UI

$("tbody").sortable({connectWith:"tbody"});

您应该在用户可以拖动元素的位置应用最小宽度和高度:

table{
  padding:5px 0; // To have a min height of 10px
  min-width:100px;
}

检查 this Fiddle