如何使手風琴元素可排序和可拖拽

Question

我有一些開發可拖/拖物品的模式。層次結構如下爲

​​

這樣做的HTML如下：

<ul id="Menu"> 
<li> 
    <span class="head">Input</span> 
    <div class="childs"> 
     <ul>  
     <li class="draggable"> 
      <input type="checkbox"/> 
     </li> 
     <li class="draggable"> 
      <input type="radio"/> 
     </li>  
     </ul> 
    </div> 

    <span class="head">Controls</span> 
    <div class="childs"> 
     <ul>  
     <li class="draggable"> 
      <input type="file"/> 
     </li> 
     <li class="draggable"> 
      <input type="button"/> 
     </li>  
     </ul> 
    </div> 
</li> 
</ul> 



<ul class="sortable"> 
<li> Drag elements Here.</li> 
</ul> 

主要問題是沒有手風琴的可拖動的元素提供像在何處放置他們一些視覺反饋是什麼。而當以手風琴結構（這些元素：

<span class="head">Controls</span> 

<div class="childs"> 

）被施加，則反饋僅可拖動元件的UL內。我可以將它們放入Sortable區域。我只需要讓他們提供沒有手風琴的反饋......

Answer 1

Chk this link。這應該有幫助 -

Nested Sortable Jquery Plugin