Tree

A tree consists of tree parts, the set of columns, the set of footers, and the tree body. The set of columns is defined by a number of treecol components, one for each column. Each column will appear as a header at the top of the tree. The second part, The set of footers is defined by a number of treefooter components, one for each column also. Each column will appear as a footer at the bottom of the tree. The third part, the tree body, contains the data to appear in the tree and is created with a treechildren component.

<window title="tree demo" border="normal">
    <tree id="tree" width="400px" rows="5">    
        <treecols sizable="true">        
            <treecol label="Name"/>            
            <treecol label="Description"/>            
        </treecols>        
        <treechildren>        
            <treeitem>            
                <treerow>                
                    <treecell label="Item 1"/>                    
                    <treecell label="Item 1 description"/>                    
                </treerow>                
            </treeitem>            
            <treeitem>            
                <treerow>                
                    <treecell label="Item 2"/>                    
                    <treecell label="Item 2 description"/>                    
                </treerow>                
                <treechildren>                
                    <treeitem>                    
                        <treerow>                        
                            <treecell label="Item 2.1"/>                            
                        </treerow>                        
                    </treeitem>                    
                    <treeitem>                    
                        <treerow>                        
                            <treecell label="Item 2.2"/>                            
                            <treecell label="Item 2.2 is something who cares"/>                            
                        </treerow>                        
                    </treeitem>                    
                </treechildren>                
            </treeitem>            
            <treeitem label="Item 3"/>            
        </treechildren>        
        <treefoot>        
            <treefooter label="Count"/>            
            <treefooter label="Summary"/>            
        </treefoot>        
    </tree>    
</window>

Class Name

org.zkoss.zul.Tree

Supported Child Components

Treecols, Treechildren, Treefoot

Supported Events

Event Name

Event Type

onSelect

org.zkoss.zk.ui.event.SelectEvent

Description:

Denotes user has selected one or multiple child components(a set of treeitem).

Properties

Property

Description

Data Type

Default Value

checkmark

Sets whether the check mark shall be displayed in front of each item.

The check mark is a checkbox if isMultiple() returns true. It is a radio button if isMultiple() returns false.

Values : true|false

boolean

false

Property

Description

Data Type

Default Value

model

Sets the tree model associated with this tree.

org.zkoss.zul.TreeModel

<null>

multiple

Sets whether multiple selections are allowed.

Values : true|false

boolean

false

name

Sets the name of this component.

The name is used only to work with "legacy" Web application that handles user's request by servlets. It works only with HTTP/HTML-based browsers. It doesn't work with other kind of clients.

Don't use this method if your application is purely based on ZK's event-driven model.

String

<null>

pageSize

Sets the page size that is used by all Treechildren to display a portion of their child Treeitem, or -1 if no limitation.

int

10

rows

Sets the rows. Zero means no limitation.

int

0

selectedItem

Deselects all of the currently selected items and selects the given item.

org.zkoss.zul.Treeitem

<null>

seltype

Sets the seltype. Currently, only "single" is supported.

Values : single

String

<single>

treeitemRender

Sets the renderer which is used to render each item if getModel() is not null.

Note: changing a render will not cause the tree to re-render. If you want it to re-render, you could assign the same model again (i.e., setModel(getModel())), or fire an TreeDataEvent event.

org.zkoss.zul.TreeitemRenderer

<null>

vflex

Sets whether to grow and shrink vertical to fit their given space, so called vertial flexibility.

Note: this attribute is ignored if setRows(int) is specified

Values : true|false

boolean

false

Methods

Name

Description

Data Type

Values

addItemToSelection

Selects the given item, without deselecting any other items that are already selected.

Treeitem

clear

Clears all child tree items

Note: after clear, getTreechildren() won't be null, but it has no child

clearSelection

Clears the selection.

getItemCount

Returns the number of child Treeitem

int

getItems

Returns a readonly list of all descending Treeitem (children's children and so on) ,

Collection

getSelectedCount

Returns the number of items being selected.

int

getSelectedItems

Returns all selected items.

Set

getTreechildren

Returns the treechildren that this tree owns (might null).

Treechildren

getTreecols

Returns the treecols that this tree owns (might null).

Treecols

getTreefoot

Returns the treefoot that this tree owns (might null).

Treefoot

removeItemFromSelection

Deselects the given item without deselecting other items.

Treeitem

selectAll

Selects all items.

selectItem

Deselects all of the currently selected items and selects the given item.

Treeitem

toggleItemSelection

If the specified item is selected, it is deselected.

Treeitem

Inherited From