Zdarzenia jsTree dnd nie zwalniające

Question

Próbuję przechwycić zdarzenia dnd w jsTree 3.0.0. Użyłem kodu demo do zbudowania procedur obsługi zdarzeń. Drzewo buduje się dobrze, ale wydarzenia nigdy nie wybuchają. czego mi brakuje?

To jest istotna część. JSON działa dobrze i buduje samo drzewo. Jednak wywołania console.log nigdy nie występują podczas przeciągania i upuszczania na drzewie.

<link href="/jquery/jquery-ui-1.10.3/css/ui-lightness/jquery-ui-1.10.3.custom.min.css" rel="Stylesheet"/> 
<script src="/jquery/jquery-ui-1.10.3/js/jquery-1.9.1.js"/> 
<script src="/jquery/jquery-ui-1.10.3/js/jquery-ui-1.10.3.custom.min.js"/> 
<link href="/jquery/plugins/jsTree/themes/default/style.min.css" rel="stylesheet"/> 
<script src="/jquery/plugins/jsTree/jstree.js"/> 
<script> 
    $(function() { 
     $('#jstree') 
     // listen for events 
     .on('dnd_start.vakata', function (e, data) { 
      console.log('Dragged'); 
     }) 
     .on('dnd_stop.vakata', function (e, data) { 
      console.log('Dropped'); 
     }) 
     // create the instance 
     .jstree({ 
      "core" : { 
       "check_callback" : true, 
       'data' : {        
        'url' : 'categoriesJson.pm?json=1', 
        'data' : function(node) { 
         console.log (node); 
         return { 
          'id' : node.id 
         } 
        } 
       }, 
       "themes" : { 
        "stripes" : true 
       } 
      }, 
      "plugins" : [ "dnd" ] 
     }); 

     $(document).bind("drag_stop.vakata", function (e, data) { 
      if (data.data.jstree) { 
       console.log('User stopped dragging'); 
      } 
     });     
    }); 
</script>     

Answer 1

Zdarzenie jest wyzwalane tylko na "dokumencie". Wypróbuj to:

$(document).on('dnd_start.vakata', function (e, data) { 
    console.log('Started'); 
}); 

Działa!

Answer 2

W dokumentacji https://www.jstree.com/api/#/?q=event&f=dnd_start.vakata

wydarzenia DND (dnd_start, dnd_move, dnd_stop) są wywoływane na dokumencie, a nie na drzewie.

Zdarzenia te różnią się od zdarzenia "move_node.jstree", które jest wywoływane tylko na końcu przeciągnięcia & Upuść (odpowiednik zdarzenia upuszczenia).

$(document).bind("dnd_start.vakata", function(e, data) { 
    console.log("Start dnd"); 
}) 
.bind("dnd_move.vakata", function(e, data) { 
    console.log("Move dnd"); 
}) 
.bind("dnd_stop.vakata", function(e, data) { 
    console.log("Stop dnd"); 
}); 
$("#tree").jstree({ 
    // tree... 
}).bind("move_node.jstree", function(e, data) { 
    console.log("Drop node " + data.node.id + " to " + data.parent); 
});