在Jstree中创建新节点

时间:2015-10-06 23:58:52

标签: jquery jstree

我一直在尝试创建一个带有jstree的简单页面,允许创建新节点。我实现了创建树,我可以在页面中看到它,但是当我尝试创建一个新节点时,我只得到一个" false"作为创建节点的指令的结果。

我在互联网上看过一些例子,但我找不到问题。

有人可以帮助我吗?

这里是整个代码

<!DOCTYPE html>
<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title></title>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-cale=1.0">
        <link rel="stylesheet" href="content/style.css" />
        <script src="script/jquery-1.11.3.min.js" type="text/javascript"></script>
        <script src="script/jstree.min.js" type="text/javascript"></script>
    </head>
    <body>
        <div id="jstree-div"></div>
    </body>

    <script type="text/javascript">
            $('#jstree-div').jstree({
                'core': {
                    'data': [
                       'Simple root node',
                       {
                           'text': 'Root node 2',
                           'state': {
                               'opened': true,
                               'selected': true
                           },
                           'children': [
                                { 'text': 'Child 1' },
                                'Child 2'
                            ]
                       }
                    ]
                },
                'plugins': ['contextmenu'],
                'contextmenu': {
                    'items': function($node) {
                        var tree = $("#jstree-div").jstree(true);
                        return {
                            "Create": {
                                'label': 'Crear',
                                "action": function (data) {
                                    var ref = $.jstree.reference(data.reference);
                                    sel = ref.get_selected();
                                    if (!sel.length) { return false; }
                                    sel = sel[0];
                                    sel = ref.create_node(sel, { "text": "New node" }, 'last');
                                    if (sel) {
                                        ref.edit(sel);
                                    }
                                }
                            }
                        }
                    }
                }
            });
    </script>
</html>

2 个答案:

答案 0 :(得分:1)

问题是您未允许修改配置中的结构,添加check_callback选项:

'core': {
    'check_callback' : true,
    'data': [

答案 1 :(得分:0)

您的方法和引用似乎与我的有点不同,我的节点创建嵌入在ajax调用中的所有内容。但是,我已经删除了对我来说有用的东西,我认为应该适用于你的设置:

contextmenu : {
    items : function (node) {
        var tmp = $.jstree.defaults.contextmenu.items();
        tmp.create.action = function (data) {
            var inst = $.jstree.reference(data.reference),
            obj = inst.get_node(data.reference);
            inst.create_node(obj, {type: "item", text: "some text"}, "last", function (new_node) {
                new_node.state = {
                    is_draggable: true,
                    opened: true,
                    disabled: false,
                    loaded: true
                };
            });
        }
        return tmp;
    }
}