No se puede colocar el jquery ui helper en droppable

Question

¿Por qué este código no me permite soltar el helper en la región desplegable?

$(".product").draggable({ 
    revert: 'invalid', 
    cursorAt: { top: -12, left: -20 }, 
    helper: function(event) { 
     return $('<div class="product_helper"></div>'); 
    } 
    }); 
    $(".droppable").droppable({ 
    accept: '.product_helper', 
    drop: function(event, ui) { 
     $(this).append(ui.helper); 
    } 
    }); 

¿Es incluso posible eliminar un ayudante en una lanzables?

Answer 1

Es completamente posible soltar un clon del ayudante pero el ayudante mismo (como en su ejemplo) no se puede soltar.

He aquí una demostración de jsFiddle dejando caer un ayudante clonado: http://jsfiddle.net/jKabn/1/

Aquí está el código relacionado:

$(".product").draggable({ 
    revert: 'invalid', 
    cursorAt: { top: -12, left: -20 }, 
    helper: function(event) { 
     return $('<div class="helper">Helper</div>'); 
    } 
    }); 
    $(".droppable").droppable({ 
    drop: function(event, ui) { 
      //clone and remove positioning from the helper element 
      var newDiv = $(ui.helper).clone(false) 
       .removeClass('ui-draggable-dragging') 
       .css({position:'relative', left:0, top:0}); 

      $(this).append(newDiv); 
    } 
    }); 

El ayudante se retira después de la caída se ejecuta en jQuery. Para mantenerlo, deberá eliminar el CSS y el posicionamiento específicos que se pueden arrastrar, así como clonar el elemento. En el jsFiddle también hay una demostración para dejar caer elemento "arrastrable" también (no es que fuera especialmente relevante a su pregunta sólo estaba añadiendo que para mí.)

Espero que ayude

Answer 2

un problema que tenía era tener un elemento arrastrable que sea demasiado ancho para caer sobre un elemento que se puede soltar si la opción de tolerancia está en el valor predeterminado de 'intersectar'.

'intersect' significa que el elemento que se puede arrastrar se puede soltar cuando el 50% del mismo se encuentra sobre el elemento desplegable. Y eso es imposible si es más del doble de ancho.

Mis arrastrables tenían un valor variable, por lo que su ancho variaba y si podían soltarse variaban también. Usé 'puntero' y pasa donde está el mouse.