Listhead

From Documentation
Revision as of 06:27, 25 July 2012 by Jumperchen (talk | contribs)

Listhead

Employment/Purpose

A list headers used to define multi-columns and/or headers. Can only surpport Listheader as its child.

Example

ZKComRef Listbox Example.png

 <window title="listbox demo" border="normal" width="250px">
         <listbox id="box">
             <listhead sizable="true">
                 <listheader label="name" sort="auto"/>
                 <listheader label="gender" sort="auto"/>
             </listhead>
             <listitem>
                 <listcell label="Mary"/>
                 <listcell label="FEMALE"/>
             </listitem>
             <listitem>
                 <listcell label="John"/>
                 <listcell label="MALE"/>
             </listitem>
             <listitem>
                 <listcell label="Jane"/>
                 <listcell label="FEMALE"/>
             </listitem>
             <listitem>
                 <listcell label="Henry"/>
                 <listcell label="MALE"/>
             </listitem>
             <listfoot >
                 <listfooter><label value="This is footer1"/></listfooter>
                 <listfooter><label value="This is footer2"/></listfooter>
             </listfoot>
         </listbox>        
 </window>

Properties

Menupopup

By default, the none is assumed, you can specify the auto to appear a default menu for the listhead. Or you can provide your own menupopup for the component.

[Since 6.5.0]

Auto

ZKComRef Listbox Columns Menu.PNG

<zk>
	<listbox>
		<listhead menupopup="auto">
			<listheader label="Author" sort="auto"/>
			<listheader label="Title" sort="auto"/>
			<listheader label="Publisher" sort="auto"/>
			<listheader label="Hardcover" sort="auto"/>
		</listhead>
		// omitted...
	</listbox>
</zk>

Customized Menupopup

ZKComRef Listbox Columns Customized Menu.png

<window title="Column's Menu Demo" border="normal" width="500px">
	<menupopup id="editPopup">
        <menuitem label="Group" image="~./zul/img/grid/menu-group.png"/>
        <menuitem label="Sort Ascending" image="~./zul/img/grid/menu-arrowup.png"/>
        <menuitem label="Sort Descending" image="~./zul/img/grid/menu-arrowdown.png"/>
	</menupopup>
	<listbox>
		<listhead menupopup="editPopup">
			<listheader label="Author" sort="auto"/>
			<listheader label="Title" sort="auto"/>
			<listheader label="Publisher" sort="auto"/>
			<listheader label="Hardcover" sort="auto"/>
		</listhead>
		// omitted...
	</listbox>
</window>

As you can see, the example above specify a customized menupopup to the columns as its column menu.

Supported Events

Name
Event Type
None None

Supported Children

* Listheader 

Use Cases

Version Description Example Location
5.0 Multiline Listheader http://www.zkoss.org/forum/listComment/6864

Version History

Last Update : 2012/07/25


Version Date Content
6.5.0 June 2012 ZK-120: Provide menupopup="auto" for listbox



Last Update : 2012/07/25

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.