禁用从一个级别拖放到另一个级别

Question

我有一个由 jstree 形成的树视图，我想禁用从一个级别到另一个级别的拖放节点。举个例子：

分支 1
- 叶 1
- 叶 2
- 叶 3
分支 2
- 叶 4
- 叶 5
分支 3
- 叶 6
- 叶 7
分支机构 4
- 叶 8

我希望用户能够移动 branch/re-order 叶子并重新排序分支，但不能将 leaf 提升为 branch 或将 branch 降级为leaf.

我已经开始查看文件 jstree.dnd.js 以改变行为方式，但不幸的是，这超出了我的能力范围。

我该怎么做？

Answer 1

您可以使用 jstree types 插件。只需将其包含在您的配置 plugins 数组中即可。然后相应地配置您的节点（要为节点分配类型，请确保它在 JSON 中具有 type 属性）。

这是一个示例配置：

"types" : {
    "#" : { // the root node can have only "branch" children
        "valid_children" : ["branch"]
    },
    "branch" : { // any "branch" can only have "leaf" children
        "valid_children" : ["leaf"]
    },
    "leaf" : { // "leaf" typed nodes can not have any children
        "valid_children" : []
    }
},

这是一个演示：
http://jsfiddle.net/DGAF4/560/

您可以在存储库和文档页面上阅读有关类型插件的更多信息。

请记住，您可以使用 core.check_callback 函数并避免使用 types 插件 - 它可以让您完全手动控制，但使用起来有点复杂。如果由于某种原因以上对您不起作用，我可以详细说明。

Answer 2

不使用类型插件的解决方案确实简单得多，恕我直言。您只需检查父 ID：

$('#jstree').jstree({
    'core': {
        'check_callback' : function (operation, node, node_parent, node_position, more) {
            if (operation === 'move_node' && node.parent !== node_parent.id) {
                return false;
            }

            return true;
        }
    },
    'plugins': ['dnd']
});

禁用从一个级别拖放到另一个级别

Disable drag'n'drop from a level to another one

jstree

jstree-dnd