Paging"
From Documentation
m (→Example) |
|||
| Line 9: | Line 9: | ||
= Employment/Purpose = | = Employment/Purpose = | ||
| + | A <tt>paging</tt> component is used to separate long content into multiple pages. For example, assume that you have 100 items and prefer to show 20 items at a time, then you can use the paging components as follows. | ||
| + | Then, when a user clicks on the hyperlinks, the <tt>onPaging </tt>event is sent with an instance of <tt>org.zkoss.zul.event.PagingEvent</tt> to the paging component. To decide which portion of your 100 items are visible, you shall add a listener to the paging component. | ||
| + | |||
| + | The <tt>listbox </tt>and <tt>grid </tt>component support the paging intrinsically, so you don't need to specify a paging component explicitly as above, unless you want to have different visual layout or to control multiple listbox and grid with one paging component. | ||
= Example = | = Example = | ||
Revision as of 10:50, 27 April 2010
Paging
- Demonstration: Paging (with Grid), Paging (with Listbox), Paging (with Tree)
- Java API: Paging
- JavaScript API: Paging
Employment/Purpose
A paging component is used to separate long content into multiple pages. For example, assume that you have 100 items and prefer to show 20 items at a time, then you can use the paging components as follows.
Then, when a user clicks on the hyperlinks, the onPaging event is sent with an instance of org.zkoss.zul.event.PagingEvent to the paging component. To decide which portion of your 100 items are visible, you shall add a listener to the paging component.
The listbox and grid component support the paging intrinsically, so you don't need to specify a paging component explicitly as above, unless you want to have different visual layout or to control multiple listbox and grid with one paging component.
Example
<vbox>
<paging totalSize="100" pageSize="20"/>
</vbox>
Supported events
| None | None |
Supported Children
*NONE
Use cases
| Version | Description | Example Location |
|---|---|---|
| 5.0+ |
Version History
| Version | Date | Content |
|---|---|---|
| 5.x.x | x/x/20xx | Initialization |