jquery draggable stop event

Question

I have searched a lot of.But I can't find answer.Maybe dublicate.Here is a bit of my code:

$(".box").draggable({
        revert:"invalid",
        stop:function(ev,ui){
            //if(dropped) alert(ui.item.attr("id");
            //else alert("Not dropped");
        }
    });
$(".box").droppable({
        accept:function(drag){
            return $(drag).attr("data-id")===$(this).attr("data-id");
        },
        drop:function(ev,ui){

        }
    });

I have looked droppable options and draggable options.But it isn't helpfull.In other word how to access dropped element using draggable options,events and methods. Also dublicate with jQuery Droppable, get the element dropped

How to get the dropped element Id if it is dropped from Draggable stop function.

Answer 1

It's easy to get one in droppable. But not with draggable there's hacky way to get id of dropped element on stop event in draggable...

I tried it in my previous projects, works like charm.

Try this :

$( "#draggable" ).draggable(
      { handle: "p",
        stop: function(event, ui){
          console.log(event);
          console.log($(ui.helper[0]).children().attr('id'));
     }
});

http://jsfiddle.net/rahulrulez/gg4z10v4/

Answer 2

I use this and it works for me:

   $trash2.droppable({
        accept: "#gallery > li",
        activeClass: "ui-state-highlight",
        drop: function (event, ui) {
            deleteImage(ui.draggable);
        }
    });