jstree mover, arrastrar y soltar

Question

Quiero implementar la funcionalidad mover para un nodo en jstree. ¿Es el movimiento lo que se debe implementar o arrastrar y soltar? Alos, será bueno tener un código de trabajo que vincule el contenedor con el evento y el código del evento.

Answer 1

Solo necesita usar el complemento dnd si no necesita hacer cumplir las reglas de movimiento (no permita que ciertos nodos se muevan a otros nodos, etc.) Si necesita aplicar reglas de movimiento, puede agregar el plugin crrm.

Consulte la Reorder only demo de la documentación de dnd pluign para ver un ejemplo de esto. La documentación es muy pobre, por lo que deberá usar la herramienta de desarrollador en su navegador para ver cuáles son las propiedades del parámetro para la devolución de llamada check_move. Para el ejemplo en la documentación, m.o se refiere a su nodo arrastrado y m.r se refiere a su nodo de destino.

También es probable que tenga que ser notificado cuando se mueve un nodo, por lo que se unen al evento move_node.jstree al inicializar el árbol:

$("#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! 
    } 
}) 
});