根据Kendo TreeView中的子节点显示隐藏根节点

时间:2014-09-05 06:53:35

标签: jquery kendo-ui treeview kendo-treeview

我需要使用不带复选框的kendoTreeView来显示/隐藏根节点和子节点。

情景是:

1)当我点击根节点时,所有子节点都应该隐藏 2)当我点击单个子节点然后该单个节点被隐藏 3)当我点击所有子节点时,根应该隐藏 4)当我再次点击显示子节点时,应显示根节点。

我可以使用以下代码实现1和2,但3和4步不起作用。

请参阅以下代码:

 select: function (e) {
                e.preventDefault();
                var item = $(e.node);
                var treeviewData = treeview.data("kendoTreeView");
                var node = treeviewData.dataItem(e.node);
                var rootNode = treeviewData.dataItem(treeviewData.parent(e.node));
                node.isSelected = !node.isSelected;
                if(node && node.items && node.items.length > 0){
                    var childern = $(item).find('.k-in');
                    var childrenDataItem;
                    if(childern){
                         for (var i = 0; i < childern.length; i++) {
                             childrenDataItem =  treeviewData.dataItem(childern);
                             childrenDataItem.isSelected = node.isSelected;
                            $this._changeLegendState(childern[i],rootNode,node.isSelected);
                         }
                    }

                }else{
                        $this._changeLegendState(item,rootNode,node.isSelected);
                }

现在,基于此我正在调用(_chanegLegendState)方法,我在其中添加show / hide类。

_changeLegendState : function(node,rootNode,isSelected){
        if(isSelected){
            if($(node).hasClass("chartlegend-selected")){
                $(node).removeClass("chartlegend-selected");
                $(node).addClass("chartlegend-unselected");

            }else if($(node).hasClass("chartlegend-unselected")){
                $(node).removeClass("chartlegend-unselected");
                $(node).addClass("chartlegend-selected");
            }else{
                $(node).addClass("chartlegend-selected");
            }
        }
        }

请告诉我如何实现3步和4步,或者是否有其他更简单的方法来实现上述4个步骤。

0 个答案:

没有答案