jstree move, drag and drop

Len Smith picture Len Smith · May 7, 2012 · Viewed 32.5k times · Source

I want to implement the move functionality for a node in jstree. Is it the move that needs to be implemented or the drag and drop? Also, it would be nice to have working code for binding the container to event and the event code.

Answer

Bojin Li picture Bojin Li · May 8, 2012

You only need to use the dnd plugin if you don't need to enforce any move rules(don't allow certain nodes to be moved to other nodes etc) If you need to enforce move rules, you can add the crrm plugin.

See the Reorder only demo of the dnd pluign documentation for an example of this. The documentation is very poor, so you will have to use the developer tool on your browser to see what the properties of the parameter for the check_move callback are. For the example in the documentation, m.o refers to your dragged node and m.r refers to your destination node.

You will also likely need to be notified when a node is moved, so bind to the move_node.jstree event when you initialize the tree:

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