javascript - onCollapse 将父节点设置为选定节点，如果子节点/孙节点已被选中(bootstrap treeView)

Question

我有工作 Bootstrap TreeView 。我想在此添加一项功能。

https://jsfiddle.net/evk9yfum/

https://github.com/jonmiles/bootstrap-treeview (使用插件)

例如:onNodeCollapsed:如果已选择折叠节点的子节点/孙节点。那么当前折叠的节点应该显示为选定节点。

然后展开同一个节点。它应该显示其/最后选择的或子节点/孙节点。

onNodeCollapsed: function(event, node) {
    $.each(node.nodes, function() {
      if (this.state.selected) {
        $('#treeview-selectable').treeview('selectNode', [node.nodeId, {
          silent: true
        }]);
        return;
      }
    });
  }

Answer 1

使用这个 var slectedNodeId, hasSelect=false, nodeIdList=[] 三个全局变量，然后像下面的代码一样。希望这对您有所帮助。

onNodeExpanded:function(event, node){                    
      $.each(node.nodes, function(){ 
            if((this.nodeId==slectedNodeId || nodeIdList.indexOf(this.nodeId)>-1) 
                && hasSelect)
            {
                 $('#treeview-selectable').treeview('selectNode', 
                              [ this.nodeId, { silent: true } ]);
            }
      });  
}, 
onNodeCollapsed:function(event, node){
       nodeIdList.push(node.nodeId);
       $.each(node.nodes, function(){ 
             if(this.state.selected){
                 $('#treeview-selectable').treeview('selectNode', 
                                 [nodeIdList[0], { silent: true } ]);
                 hasSelect=true;
             }
       });     
},
onNodeSelected: function (event, node) {
       slectedNodeId=node.nodeId;
       nodeIdList=[];
       hasSelect=false;

       $(this).treeview('unselectNode', [ node.nodeId, { silent: false } ]);
},
onNodeUnselected: function (event, node) {
       $(this).treeview('selectNode', [ node.nodeId, { silent: true } ]);             
}

更新 fiddle here : https://jsfiddle.net/evk9yfum/24/