I use jsTree library (ver. 3.1.1) with the dnd plugin.
In my tree i have two classes for no_dragging und locked. It means - no_dragging = the node can not dragged locked = dragged node can not place on this node
But i have no idea how can i say jstree this node is not for dragging oder locked. See the Code
$('#jstree1').jstree('destroy').jstree({
'core' : {
'check_callback' : true,
'multiple' : false
},
"dnd": {
'copy': false
},
'plugins' : [ 'types', 'dnd' ],
'types' : {
//the types
}
});
$(document)
.on('dnd_start.vakata.jstree', function (e, data) {
if($(data.element).closest('li').hasClass("no_dragging")){
//no_dragging for this node
//????
}
})
.on('dnd_move.vakata', function (e, data) {
var t = $(data.event.target);
if(!t.closest('li').hasClass("locked")) {
data.helper.find('.jstree-icon').removeClass('jstree-er').addClass('jstree-ok');
}
else {
data.helper.find('.jstree-icon').removeClass('jstree-ok').addClass('jstree-er');
//dont move the node in this node
//????
}
})
Do not use the dnd_start
event - it fires when you are already moving a node.
If you want to prevent dragging use the is_draggable
config option:
is_draggable : function (nodes) {
var i = 0, j = nodes.length;
for(; i < j; i++) {
if(this.get_node(nodes[i], true).hasClass('no_dragging')) {
return false;
}
}
return true;
}
Preventing a node from being dropped on a parent is another deal - use the core.check_callback
config option as a function, which you have now set to true
.
check_callback : function (op, node, parent, position, more) {
if((op === 'move_node' || op === 'copy_node') && parent.li_attr.class && parent.li_attr.class.indexOf('locked') !== -1) {
return false;
}
return true;
}
Here is a fiddle: http://jsfiddle.net/DGAF4/512/