Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Drag & Drop between two trees in jstree

There are 2 tree. Menu tree and Category tree, a node in both of trees can move(reorder) in the tree of itself, and also a node from Category tree can move(drag & drop) to Menu tree. I bind the callback of move_node, every time a node dragged and dropped within its tree or a node dragged & dropped to another tree, this callback executes. My code:

// bind move node from one parnt to another event
.bind("move_node.jstree", function (e, data) {
    data.rslt.o.each(function (i) {
        $.ajax({
            async : false,
            type: 'POST',
            url: "/menus/move/",
            dataType: 'json',
            data : {
                "operation" : "move_node",
                "id" : $(this).attr("id").replace("node_",""),
                "parent" : data.rslt.cr === -1 ? 1 : data.rslt.np.attr("id").replace("node_",""),
                "oldParent" : data.rslt.op.attr("id").replace("node_",""),
                "position" : data.rslt.cp + i,
                "oldPosition" : data.rslt.cop,
                "title" : data.rslt.op.children("a").text()
            }           });
    });
})

How can I detect this moved node is for another tree or is for the same tree.

like image 919
Arash Mousavi Avatar asked Oct 20 '22 19:10

Arash Mousavi


1 Answers

According to the documentation, the data.rslt in the move_node callback function is a move object.

In this object the attributes ot and rt (origin tree-instance and referenced tree-instance respectively) can be used to to check whether the node was dropped in the same tree or a different one:

.bind("move_node.jstree", function (e, data) {
   if(data.rslt.ot != data.rslt.rt) {
      console.log("Node was moved to a different tree-instance");
   }
   else {
      console.log("Node was moved inside the same tree-instance");
   }
});
like image 176
Björn Avatar answered Oct 30 '22 20:10

Björn