56
Views
8
Comments
Solved
[zTree] Hide icon + and - by zTree
ztree
Web icon
Forge asset by Eduardo Luís

Hi!

I am using the ZTree component and I have a situation that I cannot progress.

How do I hide the "+" and "-" icon from the tree?


2022-06-17 09-22-26
Huarlem Lima
Solution

Hi Danilo, 

The (+) button appears according to the IsParent property, so for it doesn't appear when you don't hear children, just set IsParent to false when assembling the list (for nodes that don't have children).

UserImage.jpg
Danilo Vilarinho

Set CSS:

.ztree li span.button.ico_docu{background-position: -110px 0;} 

UserImage.jpg
Cláudio Rodrigues

Hi Danilo,

I'm not sure if you can get rid of the "+" and "-" within the widget or configuration.

But you can hidden them with CSS:

.ztree .button.roots_open,
.ztree .button.roots_close,
.ztree .button.center_open,
.ztree .button.center_close,
.ztree .button.bottom_open,
.ztree .button.bottom_close{
    display: none;
}

Best Regards,

Cláudio Rodrigues


UserImage.jpg
Danilo Vilarinho

Cláudio, thanks for the quick reply. I believe that this will work. But I need to make a condition that is: The (+) button will only hide when there are no children associated with it.

That way you will always hide. Do you have any suggestions?

UserImage.jpg
Cláudio Rodrigues


Unfortunately  it can't be done via CSS.

In that case I suggest to use the "isHidden" property on the parent when he has no children.

Best Regards,

Cláudio

UserImage.jpg
Danilo Vilarinho

When using this isHidden property. It does is hide the node that is as True.

2019-09-24 18-41-25
Jorge Martins
 
MVP

Hi Danilo,

If you add the forge component to your original post's data (Edit and then use the "+ Forge Component" button), that will make it easier for the team that developed it to notice your question and address it.

Cheers! 

UserImage.jpg
Danilo Vilarinho

Thanks for the tip Jorge!

2022-06-17 09-22-26
Huarlem Lima
Solution

Hi Danilo, 

The (+) button appears according to the IsParent property, so for it doesn't appear when you don't hear children, just set IsParent to false when assembling the list (for nodes that don't have children).

UserImage.jpg
Danilo Vilarinho

Set CSS:

.ztree li span.button.ico_docu{background-position: -110px 0;} 

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.