JSTree 选择打开节点

Posted

技术标签:

【中文标题】JSTree 选择打开节点【英文标题】:JSTree Select Open Node 【发布时间】:2021-04-30 15:07:44 【问题描述】:

我的 JSTree 有问题。

我正在用数据库中的数据填充所选项目。 但我希望我选择的项目在填充后自动打开。自动开启部分我做不到。

我在页面上添加了一个按钮 (btn_test)。 我在这个按钮的点击事件中写了以下内容。

$("#TreeElement").jstree("toggle_node","#34B526D0-1E2C-4170-829E-1995782DB831");

当我点击 btn_test 按钮时,其 ID 被写入的节点打开和关闭。但是我无法将其设置为在选择和填充相应节点时自动打开。

$("#btn_test").click(function () 
        $("#TreeElement").jstree("toggle_node","#34B526D0-1E2C-4170-829E-1995782DB831");
    );

JS端如下;

var TreeElement = $("#TreeElement");

TreeElement.jstree(
        "core" : 
          "check_callback" : true
        ,
        state :  "opened" : true 
     );

TreeElement.bind("select_node.jstree", function (e, data) 

        GetSelectedElementChildrenNodes(data.node.id);

    );
 

function GetSelectedElementChildrenNodes(SelectedNodeId) 

    $.getJSON('http://serveripadress/api/browser.php?getchildren='+SelectedNodeId,function (data) 
        
        $.each(data,function (index,element) 
            TreeElement.jstree().create_node(SelectedNodeId
                ,  "id" : element.nodeid, "text" : element.nodename, "last");
            TreeElement.jstree(true).set_icon(element.nodeid,element.icon);

        );

    );

当我如下更改代码时,我得到了不同的结果。 我点击Node1,里面填满了相关数据,但是没有打开,然后我点击Node2,但是node1正在打开:)

TreeElement.bind("select_node.jstree", function (e, data) 

        GetSelectedElementChildrenNodes(data.node.id);
        $("#"+data.node.id).jstree("open_all");
    );

我一直在更改代码一段时间,但我就是无法让它工作。如果有人能帮我解决这个问题,我真的很感谢他。

非常感谢!

【问题讨论】:

【参考方案1】:

问题已解决。

在我用 Json 拉取数据的函数中,我在 getJson 的末尾添加了以下代码。

TreeElement.jstree("toggle_node",NodeId);

函数的新状态如下;

function GetSelectedElementChildrenNodes(SelectedNodeId) 

    $.getJSON('http://serveripadress/api/browser.php?getchildren='+SelectedNodeId,function (data) 
        
        $.each(data,function (index,element) 
            TreeElement.jstree().create_node(SelectedNodeId
                ,  "id" : element.nodeid, "text" : element.nodename, "last");
            TreeElement.jstree(true).set_icon(element.nodeid,element.icon);

        );

        
        TreeElement.jstree("toggle_node",NodeId);


    );

【讨论】:

以上是关于JSTree 选择打开节点的主要内容,如果未能解决你的问题,请参考以下文章

双jsTree实现

如何打开所有jstree节点(父母和孩子)

jsTree:如何将选定节点的 ID 获取到 jsTree 中的根节点?

jsTree:如何从 jstree 获取所有叶节点?

jsTree:如何从 jstree 获取所有节点?

jstree checkbox,选择父节点时会自动选中子节点,选中全部子节点会自动选中父节点。怎么去掉此功能。