除了connectWith，禁用可排序元素上的排序功能

Question

这个问题是关于如何在“sortable”元素上禁用排序，但仍然能够与“connectWith”一起正常工作。

- user1903750

Answer 1

如果在列表2中没有拖放（我称其为自我放置），则此操作将返回列表1中的元素到其原始位置。

$("#list1").sortable({
    connectWith: ".connected-fields",
    beforeStop: function(event, ui) {
        // Don't allow resorting in list1... would call cancel here, but there is a jquery 1.7 bug so we
        // need to do the check here but do the cancel in "stop" below. @see http://bugs.jqueryui.com/ticket/6054
        $(this).sortable("option", "selfDrop", $(ui.placeholder).parent()[0] == this);
    },
    stop: function(event, ui) {
        var $sortable = $(this);
        if ($sortable.sortable("option", "selfDrop")) {
            $sortable.sortable('cancel');
            return;
        }
    }
});

$("#list2").sortable({
    connectWith: ".connected-fields"
});

- splashout

Answer 2

然后我会删除原始的可排序逻辑，并应用附加到单个可排序的类。例如，您有三个函数用于排序的两个列表。如果其中一个是sort=disabled，则删除具有选项conenctWith的可排序类，并将单个排序类应用于您连接的列表。如果要停止该列表，则对另一个列表执行相同操作。

例子：

$('sortBoth').sortable({connectWith: $('.sortListToConnect)});

$('.sortList2').sortable();

$('.sortList3').sortable();

根据您需要的功能，相应地从每个列表中删除或添加类。这是一种简单处理它的方法。希望我已经清楚地陈述了它，让我们快乐地编码吧 :)

- Ronny

Answer 3

您可以尝试以下代码来禁用排序：

$( ".selector" ).sortable( "disable" );

您可以从这个链接了解更多信息。

以及这个链接学习有关禁用方法的内容。

- Ahmed Assaf

---

我想只使用connectWith进行排序，而不是禁用sortable。 - user1903750

你能提供HTML和Javascript代码吗？我认为我可以帮忙。 - Ahmed Assaf

我还没有任何代码。请查看http://jqueryui.com/sortable/#connect-lists。我想要左列与右列排序，但左列不会与自身排序。 - user1903750

Answer 4

您可以取消左列中的项目进行自我排序，但仍然可以将它们用于 connectWith。

http://api.jqueryui.com/sortable/#option-cancel

- Mandeep Jain