jQuery Context Menu choca con jQuery Draggable

Question

Estoy intentando el jQuery Context Menu con jQuery Draggable filas en un jQGrid.

El problema que tengo es que desde que agregué el jQuery Context Menu, la acción que se puede arrastrar se desencadena con un solo clic (además del arrastre normal). Parece un poco raro cuando hago clic con el botón derecho en una fila para obtener el menú, y luego hago clic fuera de ella en otra fila (para descartar el menú) y esa fila comienza siguiendo al cursor.

¿Tiene que ver con evt.stopPropagation(); en el siguiente fragmento de jQuery Context Menu?

$(this).mousedown(function(e) { 
    var evt = e; 
    evt.stopPropagation(); 
    $(this).mouseup(function(e) { 
     e.stopPropagation(); 
     var srcElement = $(this); 
     $(this).unbind('mouseup'); 
     if(evt.button == 2) { 
      // Hide context menus that may be showing 
      $(".contextMenu").hide(); 

¿Hay algo que pueda hacer al respecto, además de elegir entre arrastrar o menú contextual?

Answer 1

Tuve un problema relacionado: los elementos que se podían arrastrar con los menús contextuales adjuntos no siempre se podían arrastrar. En mi caso, un elemento arrastrable (un elemento div que flota en un elemento div que contiene más grande) con menú contextual adjunto solo se podía arrastrar una vez; una vez que se completaba el arrastre, el elemento ya no se podía arrastrar hasta que hiciste clic en el div que contenía. Los objetos arrastrables casi idénticos sin menús contextuales siempre se podían arrastrar. ¿Por qué hacer clic en el contenedor recuperado de capacidad de arrastre? No lo sé, pero lo hizo de manera consistente.

Gracias a su pregunta me apunta en la dirección correcta, miré el código de menú contextual y lo modificó de la siguiente manera, que se resolvió mi problema:

jQuery(this).mousedown(function(e) { 
    var evt = e; 
    if (e.button == 2) //Added to make this compatible with draggable 
     evt.stopPropagation(); 
    jQuery(this).mouseup(function(e) { 
     if (e.button == 2) //Added to make this compatible with draggable 
      e.stopPropagation(); 
     var srcElement = jQuery(this); 

Agregar el cheque por e.button == 2 detiene la propagación del evento de clic derecho, y ahora mis divs arrastrables se mantienen arrastrables, y el menú de contexto aún funciona. Hasta ahora, solo he probado esto en IE8, y no sé si resolverá tu problema, pero estoy interesado en saber si lo hace.

== == EDITAR

Por sugerencia de Carl R para la compatibilidad con Chrome:

jQuery(this).mousedown(function(e) { 
    var evt = e; 
    if (e.button != 2) return; //Added to make this compatible with draggable 
    evt.stopPropagation(); 
    jQuery(this).mouseup(function(e) { 
     e.stopPropagation(); 
     var srcElement = jQuery(this); 

he cambiado el modo como se sugirió, y está funcionando muy bien en IE8 esta manera.

Answer 2

Tuve el mismo problema y simplemente comenté los dos primeros * .stopPropagation() de jquery.contextMenu.js. Todo está funcionando correctamente ahora.

El único uso posible de estas paradas en este caso podría ser para un rendimiento mínimo. De hecho, reemplazar estos con * .preventDefault() tendría más sentido para mí. ¿Me estoy perdiendo de algo?