在JSTREE中同时选择父节点时,选择子节点

时间:2012-10-11 10:17:51

标签: jstree

我在选择父节点时选择子节点时遇到困难,也想打开子文件夹并选择所有子节点(不确定我是否清楚)所以我知道如何通过以下方式获取所有子节点:   

selected_nodes = $("#demo").jstree("get_selected", null, true); 
var tree = jQuery.jstree._reference('#demo'); 
var children = tree._get_children(selected_nodes); 


但是doest确实选择或打开子文件夹和节点

5 个答案:

答案 0 :(得分:1)

我放弃了这个想法..现在我只是做ajax请求加载子节点并接收一个json对象,从那里我可以看到它是一个文件或目录,如果它的目录又是另一个请求,就像这样我有整个结构

答案 1 :(得分:1)

您必须打开two_state复选框才能允许独立选择父节点和子节点。下面我为复选框插件配置了“two_state”参数:

$("#docTree").jstree({
    "themes": {
        "theme": "classic",
        "url": "jstree/themes/classic/style.css"
    },
    "plugins": ["themes", "ui", "checkbox", "json_data"],
    "checkbox": { "two_state" : true }
})

在此处查看文档:{​​{3}}

答案 2 :(得分:1)

如果我理解正确,你想在选择其中一个父母(文件夹)时选择jsTree中的所有最低后代(文件)。

不幸的是,我没有找到比下面更直接的方法。我正在使用jsTree 3.1.1并设法使用以下方法解决此问题:

var $demo = $("#demo");
var nodes =  $demo.jstree("get_top_selected", true);

//Selects all of the children of each selected node including folders
if(nodes.length > 0){
    nodes.forEach(function(node, i){
        $demo.jstree("select_node", node.children_d, true, false);
    });
}

var fileNodes = $demo.jstree("get_bottom_selected", false);

//We now need to deselect everything and only select the file nodes
$demo.jstree("deselect_all", true);
$demo.jstree("select_node", fileNodes, true, false);

上述代码允许用户“选择”多个文件夹并选择这些文件。

true函数的值"get_top_selected"的参数返回完整节点而不是ID。这使您可以访问节点的子节点。

函数"select_node"有三个参数。第一个是要选择的节点(在这种情况下是当前父节点的后代)。如果第二个参数设置为true,则会阻止为每个选定节点触发changed.jstree事件。第三个参数设置为false,设置为true会阻止子文件夹打开。

如果已选择,则函数"get_bottom_selected"仅返回一个节点,它本身没有任何子节点。由于我们现在只对节点ID感兴趣,我们可以传递参数false(或完全省略它)。

true参数再次传递给函数"deselect_all"会阻止changed.jstree事件触发。

如果您想查看jsTree API文档,可以找到它们here。该列表被过滤为仅包括选择功能和事件。可以找到完整的API列表here

我希望这会有所帮助,但如果您需要进一步澄清任何代码^ _ ^

,请告诉我

答案 3 :(得分:1)

这可能不是OP想要的,而是JSTree 3.3。我用它打开选定父节点下的所有节点。

$(treeContainer).bind("select_node.jstree", function (e, data) {
            return data.instance.open_all(data.node);
        });

答案 4 :(得分:0)

select all child nodes when parent selected ,
         $(data.rslt.obj).find("li").each( function( idx, listItem ) {
             var child = $(listItem); // child object
             $.jstree._reference("#associateRightHandTree").check_node(child);
         });

unselect all child nodes when parent unselected ,
        $(data.rslt.obj).find("li").each( function( idx, listItem ) {
            var child = $(listItem); // child object
            $.jstree._reference("#associateRightHandTree").uncheck_node(child);
        });