jQueryで開いたモーダルをドロップする

Question

要素を削除した後にモーダルウィンドウを開こうとしています。私はボードを検索して何も見つけることができません。これまで私がこれまで持っていたことはありますが、うまくいきません。項目はドラッグして、それが必要として低下しますが、モーダルは開きません。

 
    $("#table #food li.corn").draggable({ 
      revert: "invalid", 
      hoverClass: "ui-state-active", 
      drop: function(event, ui) { 
       $("#cornDialog").dialog("open"); 
         return false;  
      } 
    }); 
    $("#plate ul").droppable({ 
     hoverClass: "ui-state-active", 
     drop: function(event, ui) { 
      $(this).addClass("ui-state-highlight"); 
     } 
    }); 
    $("#cornDialog").dialog({ 
     autoOpen: false, 
     show: "blind", 
     hide: "slow" 
    }); 

Answer 1

はドロップ可能なのdrop:関数に$("#cornDialog").dialog("open");を移動してみてください。

ので、同様：

$("#plate ul").droppable({ 
    hoverClass: "ui-state-active", 
    drop: function(event, ui) { 
     $(this).addClass("ui-state-highlight"); 
     $("#cornDialog").dialog("open"); 
    } 
}); 

EDIT：代わりに、あなたがドラッグ可能にstop()を実現することができます。

$("#table #food li.corn").draggable({ 
     revert: "invalid", 
     hoverClass: "ui-state-active", 
     stop: function(event, ui) { 
      $("#cornDialog").dialog("open"); 
        return false;  
     } 
}); 

Answer 2

あなたがドロップ可能なドロップコールバックであなたのダイアログのコードを入れたいこの

ようなので、

$("#table #food li.corn").draggable({ 
     revert: "invalid", 
     hoverClass: "ui-state-active", 
     drop: function(event, ui) { 
      $("#cornDialog").dialog("open"); 
        return false;  
     } 
}); 
$("#plate ul").droppable({ 
    hoverClass: "ui-state-active", 
    drop: function(event, ui) { 
     $(this).addClass("ui-state-highlight"); 
     $("#cornDialog").dialog({ 
      autoOpen: false, 
      show: "blind", 
      hide: "slow" 
     }); 
    } 
});