jsTree - disable drag option

how can I disable draggable option in jsTree? I want to disable开发者_如何学编程 moving nodes. How can I achieve this?

Its Simple.Do not add dnd option in plugins

This includes drag & drop functionality

"plugins": ["themes","html_data","dnd","ui","types"]

This disables drag & drop functionality

"plugins": ["themes","html_data","ui","types"]

simply add this:

"default" : {
    draggable : false
},

it should be in the types: section.

Not adding the 'dnd' to the types does work. You can also use the property on the pluggin, this will disable all moving.

       dnd: {
            "is_draggable": function (node) {
                return false;  // flip switch here.
            }
        },

This has changed in the newer version of JSTree.

The way I did it (in v1.0) was in the crrm section. My check_move looked like this:

"check_move" : function (m) {
                    return (m.o.data("rel")=="itemsetting" ? false : true);
                }

m.o.data("rel") is how you get the type of the node being dragged.

This makes the node of that type not able to be dragged, giving it an X icon no matter where the node is dragged.

I wanted to disable drag & drop for disabled nodes, this worked:

const config = {
  plugins: ['dnd', ...],
  dnd: {
    is_draggable: node => !node[0].state.disabled,
  },
}

The property is_draggable seems to only disable dragging the Nodes to other positions inside the Tree. But the Nodes still remain draggable on the Page. So it's possible for example to drag the Node to an input field on the Page.

Since researching how to completely disable the dragging took me a while, this might be usefull for others that stumble upon this topic.

You can completely disable dragging by calling preventDefault() on the Event:

dnd: {
      "is_draggable": function (node) {
         e.preventDefault();
         return false;
      }
}

https://github.com/vakata/jstree/issues/1103