Tengo la posibilidad de arrastrar los elementos que se puede caer en lanzables áreas. Si un elemento se ha caído, el drop se llama a la función:

$('#droppable').droppable({
    scope: "items",
    drop: function (event, ui) {
        //this one is called if an element is dropped in this droppable area
    }
});

Mi elemento draggable:

<div class="drag" data-noteid="10">Drag me</div>
...
$('.drag').draggable({
    revert: "invalid",
    scope: "items"
});

Lo que necesito saber si el elemento se ha caído es el valor de data-noteid y la posición relativa de la lanzables de la zona. Por lo tanto, si el elemento se coloca en la esquina superior izquierda, las coordenadas x/y debe ser 0/0.

He creado un completo ejemplo de trabajo aquí: http://jsbin.com/utivo5/2/

Por lo que normalmente me puede acceder a los atributos como este:

alert($(this).data("noteid"));

alert($(this).position().top);
alert($(this).position().left);

pero todo lo que veo en este caso es undefined.

¿ Alguien sabe cómo puedo acceder a ellos? Creo que debe ser posible con event o ui que es un parámetro de la llamada drop función?!

Gracias de antemano & Saludos, Tim.

OriginalEl autor Tim | 2011-01-03

2 Comentarios

  1. 15

    En este caso, desea que el ui argumento para obtener la posibilidad de arrastrar, lugar de this que se refiere a la lanzables, específicamente ui.draggable aquí. Se debe tener este aspecto general:

    drop: function (event, ui) {
      var pos = ui.draggable.offset(), dPos = $(this).offset();
      alert("nodeid: " + ui.draggable.data("noteid") + 
            ", Top: " + (pos.top - dPos.top) + 
            ", Left: " + (pos.left - dPos.left));
    }

    Para la posición, tenemos que restar el drop de la parte superior izquierda de la posición para obtener el valor que desee aquí, que es la dPos por encima de llegar eliminado.

    Usted puede probar su demo con los cambios mencionados trabajo aquí.

    OriginalEl autor Nick Craver

  2. 4

    He encontrado por mis circunstancias, que el de arriba no funciona. No sé por qué – siempre me dio un X = -7, y = 229.

    Pero este trabajo (que se encuentra en función de la gota controlador):

    alert('X pos in drop parent container = ' + (ui.position.top - $(this).offset().top));
    No trabajo para mí, pero que otra respuesta sólo funciona para las personas con «simple» requisitos 🙂

    OriginalEl autor Nick Wright

Dejar respuesta

Please enter your comment!
Please enter your name here