Repeteadly moving JS draggable clones

Question

I have a problem with moving clones of an object, after cloning.

So - I have multiple draggables - pictures. I drag them on a #map. After putting them there, I "stick them" to a map, so they stay with it.

I have a button, that "unsticks" them and allows to change positions - they are made draggable. But the problem is - when I move them next time, nothing works. None of the verifications are tested. Nothing. It assumes that nothing is dropped. Even the log..

$('#map').droppable({
        //accept: ???
        drop: function(e,item){
             //if (item.atributes.('type')=='piece')...
            console.log("this is draggable " +item.draggable('id'));
        }
    });

But if I move on of the original pieces (that are being copied), it prints out the log perfectly.

Why isn't JS seeing the clones?

Answer 1

When you add a new clone the droppable plugin isn't applied to it because it only gets applied once initially.

I'm not sure how this droppable plugin works but see if you can add them without disrupting the existing nodes.