f30-1896600.zul

来自「ZK是一个Ajax Java Web框架」· ZUL 代码 · 共 77 行

<?xml version="1.0" encoding="UTF-8"?>

<!--
F30-1896600.zul

{{IS_NOTE
	Purpose:
		
	Description:
		
	History:
		Tue Feb 19 12:17:04 TST 2008, Created by jumperchen
}}IS_NOTE

Copyright (C) 2008 Potix Corporation. All Rights Reserved.

{{IS_RIGHT
}}IS_RIGHT
-->
<zk xmlns:n="http://www.zkoss.org/2005/zk/native">
	<n:p>Both the pagings of Grid and Listbox should be placed in where the label of radio is checked.</n:p>
	<n:ol>
		<n:li>click top, bottom or both, you will see the paging component showing was changed in listbox grid</n:li>
		<n:li>click the paging number to make sure the behavior, especially in 'both' paging component</n:li>
	</n:ol>
	
	<window>
		<hbox>
			<radiogroup
				onCheck="grid.pagingPosition = self.selectedItem.label;listbox.pagingPosition = self.selectedItem.label">
				<radio label="top" />
				<radio label="bottom" checked="true" />
				<radio label="both" />
			</radiogroup>
			<zscript>
				List items = new org.zkoss.zkdemo.userguide.BigList(10); //a big list of Integer
			</zscript>
			<div>
			Listbox
			<listbox id="listbox" mold="paging" pageSize="3" width="300px">
				<listhead>
					<listheader label="column1" />
					<listheader label="column2" />
					<listheader label="column3" />
					<listheader label="column4" />
				</listhead>
				<listitem forEach="&#36;{items}">
					<listcell label="&#36;{each}-1" />
					<listcell label="&#36;{each}-2" />
					<listcell label="&#36;{each}-3" />
					<listcell label="&#36;{each}-4" />
				</listitem>
			</listbox>
			</div>		
			<div>
			Grid
			<grid id="grid" mold="paging" pageSize="3" width="300px">
				<columns>
					<column label="column1" />
					<column label="column2" />
					<column label="column3" />
					<column label="column4" />
				</columns>
				<rows>
					<row forEach="&#36;{items}">
						<label value="&#36;{each}-1" />
						<label value="&#36;{each}-2" />
						<label value="&#36;{each}-3" />
						<label value="&#36;{each}-4" />
					</row>
				</rows>
			</grid>
			</div>
		</hbox>
	</window>
</zk>