JSTREE, exact move position

drag and dropjstree

I want to show an explicit tooltip while drag-drop tree node inside treeview.

example: "Node 1 will be moved before/after/inside Node 2"

From move_node callback argument, we can get the position ("before/after/inside") but not from check_move callback (neither from prepare_move).
Tooltip should be displayed while drag-droping, so move_node is too late.

The same problem when drag-drop external object to treeview, the drag_check callback from dnd plugin has no information about the position (we just know the target node but not if it is before, after or inside).
In that case, even for drag_finish callback we don't have the information.

Is there somebody who can help me solving this issue ?

Best Answer

I just tested this and its working fine for me on prepare_move ...

.bind("prepare_move.jstree",function(event, data) {
        console.log("o : " + data.rslt.o.attr("id"));
        console.log("r : " + data.rslt.r.attr("id"));
        console.log("p : " + data.rslt.p);
 })

this is what is logged

o : item_3
r : item_2
p : inside

I am using JSTree v1.0RC2

Related Solutions

Flex tree control drag drop .item position

I've meet a problem like this, when I had to check the node wich receive the children. To get the node parent, I'd used this :

public function getObjectTarget() : Object {
   var dropData : Object = tree.mx_internal::_dropData as Object;
   if (dropData.parent != null) {
      return dropData.parent;
   } else {
          // if there is not parent (root of the tree), I take the root directly
      var renderer : IListItemRenderer = tree.indexToItemRenderer(0);
      return renderer.data;
   }

hope this will help some one

Javascript – jstree drag and drop restrict node before and after root

In the current version of jstree (3.0.1) there is a more easy solution, everything you have to use is

"types" : {     
       "#" : {
            "max_children" : 1
        }
    },

If you are using the type plugin there are two predefined types. One is the "#" used above. This is automatically used for the "real" root element of the tree, which means the one which is internally used. So if you are adding your own root as the first node without any extra config everything will work fine.

Best Answer

Related Solutions

Flex tree control drag drop .item position

Javascript – jstree drag and drop restrict node before and after root

Related Topic