我需要使用不带复选框的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个步骤。