jstree move, drag and drop

Question

Voglio implementare la funzionalità di spostamento per un nodo in jstree. È la mossa che deve essere implementata o il drag and drop? Alias, sarà bello avere un codice funzionante dal binding del contenitore all'evento e al codice dell'evento.

Answer 1

È necessario utilizzare il plugin dnd solo se non è necessario applicare alcuna regola di spostamento (non consentire che alcuni nodi vengano spostati su altri nodi, ecc.) Se è necessario applicare le regole di spostamento, è possibile aggiungere il plugin crrm.

Vedere lo Reorder only demo della documentazione dnd pluign per un esempio di questo. La documentazione è molto scarsa, quindi dovrai utilizzare lo strumento di sviluppo del tuo browser per vedere quali sono le proprietà del parametro per il callback check_move. Per l'esempio nella documentazione, m.o fa riferimento al nodo trascinato e m.r fa riferimento al nodo di destinazione.

Sarà inoltre probabilmente bisogno di essere avvisati quando un nodo viene spostato, in modo da legare alla manifestazione move_node.jstree quando si inizializza l'albero:

$("#treeHost").jstree({ 
    ... 
    }).bind("move_node.jstree", function (e, data) { 
     // data.rslt.o is a list of objects that were moved 
     // Inspect data using your fav dev tools to see what the properties are 
     }); 
    }) 

Answer 2

$("#demo1").jstree({ 
.... 
.bind("move_node.jstree", function (e, data) { 

    /* 
    requires crrm plugin 

    .o - the node being moved 
    .r - the reference node in the move 
    .ot - the origin tree instance 
    .rt - the reference tree instance 
    .p - the position to move to (may be a string - "last", "first", etc) 
    .cp - the calculated position to move to (always a number) 
    .np - the new parent 
    .oc - the original node (if there was a copy) 
    .cy - boolen indicating if the move was a copy 
    .cr - same as np, but if a root node is created this is -1 
    .op - the former parent 
    .or - the node that was previously in the position of the moved node */ 

    var nodeType = $(data.rslt.o).attr("rel"); 
    var parentType = $(data.rslt.np).attr("rel"); 

    if (nodeType && parentType) { 
     // TODO! 
    } 
}) 
});