Draggable clone

[TheBoef]

Im pretty new to Angular, and Im trying to recreate this demo: "http://jqueryui.com/draggable/#sortable" but with mutilple sorted lists.

I got the ui-sortable working on my local machine, but its not working on Plunker... :(
http://embed.plnkr.co/WP8UKJBRWKK3rGy6A4nJ/preview

I can get the buttom 4 lists sortable and draggable with them self, but I want to add a list on the top that can only drag items in de sortable lists. Also the items that are dragged are copied (Just like the example on jqueryui).

I tried using https://github.com/codef0rmer/angular-dragdrop but it didnt got it too work with this ui-sortable.

Anyone has an example or an draggable module that works with this ui-sortable? It needs too has clone function from draggable.

[thgreasi]

I didn't know about the draggable/#sortable combo but I think that an issue with a similar use case was submitted at some point.
The final solution looked like this pen. You essentially clone the elements of the first list by restoring its model to the initial state right after the drag stops.

[thgreasi]

In the example you provided, the issue was that jquery-ui was loaded before jquery (as shown here).

[TheBoef]

Thanks for the example! Working with your solution right now!

[thgreasi]

I will just repost here:

I just found an jquery-ui issue that has a drop-clone example. It seems that jquery-ui does not provide a simple way to do this. In my opinion restoring the ng-model looks less like the trickery magic the jquery-ui example shows.
Also created a new pen, removing update&stop() in favor or (properly) utilizing the connectWith option.

Should this issue be considered resolved?

[TheBoef]

Yes, thanks for the help!