Drag and drop, and drag some more?
How do I clone something that's being dragged and dropped, and have
the clone be draggable?
----------------------------------
I'm just starting to migrate some drag-and-drop code that uses X
library to jQuery. What I had before is an interface like this:
2 DIV containers, "frombox" and "tobox". In frombox there's a bunch of
images ("items"). When you drag one from frombox to tobox it's copied.
When you drag it back it's deleted. I had this working before, but I'm
right now I'm stuck at one problem when trying to do it with jQuery
So far with the jQuery version I can drag them back and forth without
copying, and I can drag them down from "frombox" to "tobox" WITH
copying, but the clones become undraggable. My code looks like:
$("#tobox").droppable({
accept: ".itemimage",
tolerance: 'touch',
drop: function(ev, ui) {
var dropped = ui.draggable.element;
$(dropped).clone().appendTo(this);
}
});
Which allows copies to be dragged and dropped
But slapping "draggable()" inside that last chain doesn't work.
Neither of these variations work:
$(dropped).clone().draggable().appendTo(this);
$(dropped).clone().appendTo(this).draggable();