Sortierbare + verschachtelte Listen mit jQuery UI 1.8.2

Question

Diese Frage ist überall SO, aber niemand scheint das gleiche Problem gehabt zu haben wie ich.

Wenn ich etwas tun wie dies

$(function(){ 
    $('#unique-ul').sortable({items:'li'}); 
}); 

Ich würde erwarten, dass es „einfach funktionieren“. Im Großen und Ganzen tut es das. Ich kann alle <li> von einer Liste zu einer anderen Liste ziehen, und jede Unterliste dieser <li> wird mit gezogen.

Beim Ziehen scheint es jedoch ziemlich verwirrend darüber zu sein, wo es gelöscht werden sollte. Hier ist ein Beispiel mit 1.8.0; Es zeigt das gleiche Verhalten an.

http://jsbin.com/ewuxi3/

Alle anderen Antworten, die ich über mich das führen gefunden haben, zu glauben, dass dieses Verhalten von jQuery UI unterstützt wird; Zum Beispiel ist hier ein Fehler registriert gegen 1.7 über verschachtelte ziehbare: http://dev.jqueryui.com/ticket/4333

Ich kann nicht finden, jemand anderes, der dieses Problem hatte, so dass es schlägt vor, ich mache es falsch. Irgendwelche Hinweise?

Answer 1

Das passiert, weil Sortiere nicht wirklich weiß, ob Sie über dem verschachtelten <li> oder dem, der es enthält, sind. Eine Lösung ist es, eine Struktur wie folgt zu verwenden:

<ul> 
    <li><div>Item 1</div> 
    <ul> 
     <li><div>Subitem 1</div></li> 
     <li><div>Subitem 2</div></li> 
    </ul> 
    </li> 
    <li><div>Item 2</div></li> 
    <li><div>Item 3</div></li> 
</ul> 

und die Option toleranceElement: '> div'. Ich weiß nicht, warum es nicht dokumentiert ist, aber es ist drin und es sagt Sortierbar, nur die <div> bei der Berechnung von Kreuzungen zu berücksichtigen.

Wenn Sie interessiert sind, ich vor kurzem developed a plugin, die geschachtelte Sortierung erleichtert, so dass neue verschachtelte Listen im laufenden Betrieb erstellen können.