jsTree与dnd没有拖动和锁定的节点

时间:2015-05-21 16:49:02

标签: drag-and-drop jstree drag locked

我使用jsTree库(版本3.1.1)和dnd插件。

在我的树中,我有两个类no_dragging和locked。 它的意思是 - no_dragging =节点无法拖动 locked =拖动节点无法放置在此节点上

但是我不知道我怎么能说jstree这个节点不是用于拖动oder锁定。 见代码

$('#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
              //???? 
            }

        })

1 个答案:

答案 0 :(得分:1)

不要使用dnd_start事件 - 当您移动节点时它会触发。 如果您想阻止拖动,请使用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;
}

阻止某个节点被放置在父节点上是另一项交易 - 使用core.check_callback配置选项作为函数,您现在已将其设置为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;
}

这是一个小提琴: http://jsfiddle.net/DGAF4/512/