The other day when I had a problem—to be able ‘expand’ a sortable list. The problem I had was that I needed to refresh the list (while dragging) to make the list recognize the added elements as sortables; these elements are also droppable so I needed a way to make them droppable too. The fast way to do this is to call refresh—at least to make the list recognize the new elements—this will however make the list flicker. To better illustrate the problem I have created an example here: http://jsfiddle.net/Senth/xegTV/. To expand the ‘Drag onto this’ you need to hover over it for 800ms.
———
I searched on the Internet for many hours for an answer (like you always do…) but I couldn’t find another post which had the same problem; either I was searching with the wrong keywords, missed something trivial, or people haven’t shared their solutions. If I have missed something please post a comment 
———
To the solution, or at least soon, first a proclaim; I would like to say that this solution is probably inefficient when having 1 000–10 000+ elements.
The solution I came up with was to load all the elements beforehand and hide all the children by setting their css property display to none. When expanding, simple just change them to either inline or block (whichever you want). Now all elements can be sorted and are recognized. One problem still exists though; how to make the appeared elements droppable. Although they are set as droppables beforehand their position hasn’t been updated when they appear; resulting in that the list thinks you are actually hovering over the element that was below before expanding. When moving the mouse over our under the sortable list the positions would fix themselves (and sometimes during too…); if you have a long list this is surely not an acceptable solution. To always update the position the Sortable plugin needs to be extended, adding a function called updateDroppables(event); this is then called when the out event is called on a droppable element that has been expanded. The reason it is called in the out event instead of in expandCategory($id) is because an event is needed to update the positions, there is probably a better way to update them—where you don’t need an event—but I couldn’t find one without digging too much into the code.
The Solution: http://jsfiddle.net/Senth/5SFFY/
———
This solution might not be the best and cleanest, but hopefully someone will have a use for it.