Question

我正在尝试使用http://www.jstree.com因为我对演示非常满意，包括节点类型和上下文菜单。我的问题是我不太确定如何使用“json_data”从jstree中加载节点数据：{“ajax”：{...}}。我读过的所有文档似乎仍然需要手动定义父数据，而ajax调用仅适用于延迟加载的子节点。

我的代码如下：

$('#file_tree').jstree({
    "plugins": ["json_data", "themes", "ui", "crrm", "dnd", "search", "contextmenu"],
    "themes": {"theme": "apple"},
    "ui": {"select_limit": 1, "selected_parent_close": "deselect", "disable_selecting_children": "true", "initially_select": [0]},
    "crrm": {"input_width_limit": "50", "move": {"always_copy": "multitree"}},
    "dnd": {"open_timeout": "700"},
    "search": {},
    "contextmenu": {"select_node": "true"},
    "json_data" : 
    {
        "ajax" : 
        {
            "url" : "{{ url('components/tree/findall') }}",
            // the `data` function is executed in the instance's scope
            // the parameter is the node being loaded
            // (may be -1, 0, or undefined when loading the root nodes)
            "data" : function (node) { 
                    console.info("Nodes:",node);    
                     return {   
                            "operation" : "get_children",
                            "id" : node.attr ? node.attr("id").replace("node_","") : 1
                        };
                    }
        }
    }
})

url'componements / tree / findall'以JSON的形式返回所有带有parent_id = NULL及其所有子节点（有效返回所有节点数据）的节点，如下所示：

[{"id":1,"name":"Static Album 1","type":"folder","children":[{"id":3,"name":"Static Album 1.1","type":"folder","children":[]},{"id":4,"name":"Static Album 1.2","type":"folder","children":[]}]},{"id":2,"name":"Static Album 2","type":"folder","children":[{"id":5,"name":"Static Album 2.1","type":"folder","children":[]},{"id":6,"name":"Static Album 2.2","type":"folder","children":[]}]}]

但是在加载页面时从不调用路径（是的，我确实有一个id =“file_tree”的div）。如果有人和jsTree一起工作并且能给我一些关于如何使其工作的建议我会非常感激。此外，如果您认为jsTree不是树结构的goto解决方案，请随意提出替代方案。

编辑：我已经获得了调用和检索数据的路径（原来bower安装的jstree无法正常工作，所以我下载了一份副本并手动将其放入我的lib中），但我我仍然无法显示任何数据。

中的元素“节点”

"data": function(node) {....

只是返回-1（即使我的firebug控制台显示了上面检索到的所有数据），我实际上并没有得到数据。我不确定这应该如何工作......

Answer 1

原来我只是个白痴。通过下载并手动将jstree复制到我的lib文件夹（而不是使用破碎的bower版本）来实际加载树之后，我只需要在服务器端重构我的数据，然后再将其传递给jstree和viola！

jsTree和AJAX＆gt;通过ajax加载所有数据

1 个答案: