jQuery arrastrar y soltar: cómo llegar al elemento que se está arrastrando

Question

Estoy utilizando la biblioteca de jQuery para implementar arrastrar y soltar.

¿Cómo puedo obtener el elemento que se está arrastrando cuando se cae?

Quiero obtener el id de la imagen dentro del div. El siguiente elemento es arrastrado:

<div class="block"> 
    <asp:Image ID="Image9" AlternateText="10/12/2008 - Retina" Width=81 Height=84 ImageUrl="~/uploads/ImageModifier/retina.jpg" runat=server /> 
</div> 

tengo el estándar de la función bajó de su ejemplo:

$(".drop").droppable({ 
       accept: ".block", 
       activeClass: 'droppable-active', 
       hoverClass: 'droppable-hover', 
       drop: function(ev, ui) { } 
}); 

He intentado varios ui.id etc., que no parece funcionar.

Answer 1

¿No es el ui.draggable?

Si vas allí (en Firefox y suponiendo que tiene firebug) y buscar en la consola de Firebug interminables veo que estoy haciendo un console.dir del objeto ui.draggable que es el div ser arrastrado

http://jsbin.com/ixizi

por lo tanto el código que necesita en función de la gota es

 drop: function(ev, ui) { 
       //to get the id 
       //ui.draggable.attr('id') or ui.draggable.get(0).id or ui.draggable[0].id 
       console.dir(ui.draggable) 
     } 

Answer 2

redquare es correcto, dentro de su función se refiere a ui.draggable:

$(".drop").droppable({ accept: ".block", 
         activeClass: 'droppable-active', 
         hoverClass: 'droppable-hover', 
         drop: function(ev, ui) { 
          //do something with ui.draggable here 
         } 
}); 

Esa propiedad apunta a lo que se arrastra.

Tenga en cuenta que si está utilizando "ayudantes" clonados, el que se puede arrastrar será la copia clonada, no el original.

Answer 3

$(ui.draggable).attr("id")  

...

Answer 4

El ui.draggable() no parece que trabajar más. Para obtener el ID se puede utilizar

$(event.target).attr("id"); 

Answer 5

tengo

drop: function(event, ui) {alert(ui.draggable.attr("productid"));} 

Answer 6

Probé la mayoría de los anteriores, pero al final sólo

event.target.id 

trabajó para mí.

Answer 7

RESPUESTA QUE TRABAJA EN 2017

Una gran cantidad de tiempo ha pasado, y me encontré con que la corriente de respuesta aceptada ya no funciona.

Una solución que actualmente funciona:

$('#someDraggableGroup').draggable({ 
       helper: 'clone', 
       start: function(event, ui) { 
        console.log(ui.helper.context) 
        console.log(ui.helper.clone()) 
       } 
      }) 

Aquí, ui.helper.context se refiere al objeto original que está tratando de arrastrar y clone() se refiere a la versión clonada.

EDITAR

Lo anterior es también ver cuál es el objeto que está arrastrando el uso de la función draggable(). Para detectar lo draggable objeto se dejó caer en un droppable(), las siguientes obras:

$('#myDroppable').droppable({ 
    drop: function(event, ui){ 
     console.log(ui.draggable.context) 
       OR 
     console.log(ui.draggable.clone()) 
    } 
})