Question

我有一个简单的jquery ui示例。基本上我必须列出项目，每个项目都是可排序的。我想要完成的是以下内容：取消对同一列表的排序。举个例子，如果我点击列表1上位置1上的元素，然后将其拖到位置6，然后删除。我想阻止它，但是如果我把元素放在第二列中，那就没关系。

我不知道如何指定，以适应我的requeriments。 ConnectWith似乎还不够：

$("#sortable").sortable({
    connectWith: [$('#sortable2')]
});

$("#sortable2").sortable({
    connectWith: [$('#sortable')]
});

这是一个例子：

http://jsfiddle.net/sQeZE/3/

Answer 1

这可能不是完全您要查找的内容，但您可以绑定到receive和stop事件（它们按此顺序触发）。 receive表示从另一个列表收到了一个列表项。触发此操作后，您可以暂时取消阻止排序。 stop尝试始终阻止排序：

var blocksort = true;
//Using jQuery 1.6.4, but use `.on` when available
$("#sortable, #sortable2").bind('sortreceive', function () {
    blockSort = false;
}).bind('sortstop', function (e) {
    if (blockSort) {
        e.preventDefault();
    }
    blockSort = true;
});

http://jsfiddle.net/sQeZE/5/

Answer 2

一种选择是将列表的限制限制为另一个列表，如下所示：

$("#sortable").sortable({
    connectWith: [$('#sortable2')],
    containment: $('#sortable2') });

$("#sortable2").sortable({
    connectWith: [$('#sortable')],
    containment: $('#sortable') });

这使得#sortable的项目只能在#sortable2的列表中排序，反之亦然

jQuery UI Sort - 两个列表并阻止可排序的内部原始列表

2 个答案: