嵌套jQuery UI排序

有沒有一種方法可以嵌套jQuery排序？在嵌套容器中，不是嵌套列表。嵌套jQuery UI排序

<div class="container"> 
    <div class="item"></div> 
    <div class="item"></div> 
    <div class="item"></div> 
</div> 
<div class="container"> 
    <div class="item"></div> 
    <div class="container"> 
     <div class="item"></div> 
     <div class="item"></div> 
     <div class="item"></div> 
    </div> 
    <div class="item"></div> 
</div> 

$('.container').sortable({ 
    connectWith: '.container' 
});

http://jsfiddle.net/ExLqv/2/

這個例子相當多的作品，但是當我把嵌套容器我得到一個錯誤：

Uncaught HierarchyRequestError: A Node was inserted somewhere it doesn't belong.

我想這是因爲拖動container，當它被定位在老鼠，所以當我放下它時，它會試圖把它放在裏面。

我有一個工作，雖然不理想，所以問題仍然存在。

$('.container').sortable({ 
    connectWith: '.container:not(.ui-sortable-helper)', 
    tolerance: "pointer", 
    cursorAt: { left: -50 } 
});

http://jsfiddle.net/ExLqv/8/

來源

2013-10-02 Petah

有趣的......啊，我得到了'未捕獲HierarchyRequestError：無法執行「的insertBefore」上「節點」：新的子元素包含parent.' –

問題在於'helper'。你可能需要克隆助手......'$（'。container'）。sortable（{connectWith：'.container'，helper：'clone'}）;'，這當然需要一些調整。 http://jsfiddle.net/dirtyd77/Px73Q/ – Dom

問題

jQuery的失去它當元件既是可排序容器和可排序容器內的可排序的元素。

溶液

就這麼簡單包裝另外元素中有問題的對象。小提琴：http://jsfiddle.net/ExLqv/12/

的「內部」容器包裝是這樣的：

<div class="container-wrapper"> 
    <div class="container"> 
     <div class="item"></div> 
     <div class="item"></div> 
     <div class="item"></div> 
    </div> 
</div>

你避免這個問題，因爲內部容器本身不再是兩個可排序的容器和排序容器內的排序對象。相反，可排序對象現在是包裝器。請注意，類名容器包裝只是爲了說明。你可以刪除它，它不會改變功能。

現在，我不知道這種方法是否比您自己提到的解決方法更好。我確實認爲某種解決方法是必要的。很多人都遇到了這個問題，似乎普遍認爲嵌套排序並不是此時支持的功能。似乎有一大堆的解決這個問題對你來說，由結果來看插件，如果我谷歌的jQuery排序嵌套「:)

來源

2014-01-09 15:25:51

插件修復：

var sortable = $.widget("ui.sortable", $.ui.mouse, { 
    _contactContainers: function(event) { 
      // never consider a container that's located within the item itself 
      if($.contains(this.currentItem[0], this.containers[i].element[0]) || this.currentItem[0] === this.containers[i].element[0]) { 
       continue; 
      } 
    } 
}

來源

2014-10-06 05:51:46

要創建一個嵌套的排序元素可排序容器和可排序元素，需要有一個幫助器：克隆和佔位符。排序時，檢查位置佔位符是0，則再追加佔位符，以幫助拖動容器知道在何處插入背部，避免

Uncaught HierarchyRequestError: Failed to execute 'insertBefore' on 'Node': The new child element contains the parent.

這裏是小提琴測試： http://jsfiddle.net/0umjf5tc/1/

來源

2015-10-01 19:09:35 giang

你可以試試！它完美的工作！

$('.container').sortable({ 
    helper:'clone', 
    connectWith: '.container', 

});

來源

2017-03-07 03:00:16 maitian

你好，歡迎來到StackOverflow。請爲答案添加一些解釋。 – Chaithanya

嵌套jQuery UI排序

回答

相關問題