如何隐藏水平定向PrimeFaces树的根节点?

时间:2018-05-10 13:30:55

标签: primefaces

这个问题说明了一切。当树垂直呈现时,不显示根节点。将渲染设置为false不会这样做。

1 个答案:

答案 0 :(得分:0)

好吧,像往常一样,CSS来救援。使用PrimeFaces showcase上的浏览器开发人员工具进行简单尝试(我自己不使用水平树),将css display:none直接放在第一个类ui-treenode的html元素上node html使它消失,包括第一行。

enter image description here

但是那里有一些子节点......在display:none类的第一个html节点上放置一个ui-tree-content会使第一个节点的内容消失并保持线路的整齐树的功能仍然很好。

enter image description here

所以我们已经有效地知道可以做到......

唯一需要的是一个'完整'选择器。 folling隐藏了所有节点,而不是你想要的节点。

.ui-tree  .ui-treenode > .ui-treenode-content {
    display: none;
}

enter image description here

因此应该改进选择器。将所有中间元素添加到第一个节点是一个解决方案

.ui-tree > table > tbody > tr > .ui-treenode > .ui-treenode-content {
    display: none;
}

enter image description here

(用*替换表,tbody和tr也会起作用)。但是,实际选择具有类.ui-tree-node的第一个节点的更高级解决方案是

.ui-tree .ui-treenode:first-child > .ui-treenode-content {
    display: none;
}

如果你是只希望它在特定的水平树上,向该树添加一个类(例如no-root)并在选择器中使用它

.no-root.ui-tree .ui-treenode:first-child > .ui-treenode-content {
    display: none;
}

我在这里有效地做了(试图)应用基本的CSS知识,它提供了一个解决方案。请记住,客户端(99.5%的时间)所有html,css和javascript !!!

另见: 另见: