如何在两个列表之间但以一种方式进行 JQuery UI 排序答案

【问题标题】：How to JQuery UI Sortable Bettween two list but in one way如何在两个列表之间但以一种方式进行 JQuery UI 排序
【发布时间】：2015-03-13 02:14:47
【问题描述】：

我有两个可排序的项目列表，并相互连接。一个列表是数据库调用中的所有项目AllGroup 另一个是我必须添加的项目列表，请致电InGroup 我想可以从AllGroup 拖放项目并放入InGroup 并克隆它，但不能将项目从InGroup 拖放到AllGroup。我的代码：

HTML：

<div class="allgroup">
<ul id="sortable1" class="connectedSortable sort-group">
<li class="ui-state-default">Item 1</li>
<li class="ui-state-default">Item 2</li>
<li class="ui-state-default">Item 3</li>
<li class="ui-state-default">Item 4</li>
<li class="ui-state-default">Item 5</li>
</ul>
</div>
<div class="ingroup">
<ul id="sortable2" class="connectedSortable sort-group">
<li class="ui-state-highlight">Item 1</li>
<li class="ui-state-highlight">Item 2</li>
<li class="ui-state-highlight">Item 3</li>
<li class="ui-state-highlight">Item 4</li>
<li class="ui-state-highlight">Item 5</li>
</ul>

JS：

$( ".sort-group" ).sortable({
connectWith: ".connectedSortable"
}).disableSelection();
});
$('#sortable1').sortable({ 
    helper: 'clone'
});
$('#sortable1').disableSelection();

怎么办？我尝试了一些代码但没有成功。

【问题讨论】：

标签： jquery jquery-ui draggable jquery-ui-sortable

【解决方案1】：

$('.sort-group').sortable({
    connectWith: "#sortable2",
    tolerance: 'pointer',
});

$('#sortable1').bind('sortstop', function(event, ui) {
    var elm = $(ui.item[0]);
    var parent = elm.parent();
    if (!parent.is("#sortable1")) {
        var idx = parent.children().index(elm)-1,
            elm = elm.clone(true);
        parent.children(':eq('+idx+')').after(elm);
    }
    $(this).sortable('cancel');
});

你可以看看它是如何工作的：http://jsfiddle.net/tZSN7/238/

【讨论】：