draglist.zul

非常接近C/S操作方式的Java Ajax框架－ZK 用ZK框架使你的B/S应用程序更漂亮更易操作。 官网：www.zkoss.org

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

<!--
draglist.zul

{{IS_NOTE
	Purpose:
		
	Description:
		
	History:
		Thu Aug 10 14:57:00     2006, Created by tomyeh
}}IS_NOTE

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

{{IS_RIGHT
}}IS_RIGHT
-->
<window title="Reorder by Drag-and-Drop" border="normal">
	Unique Visitors of ZK:
	<listbox id="src" multiple="true" rows="5"  width="300px">
		<listhead>
			<listheader label="Country/Area"/>
			<listheader align="right" label="Visits"/>
			<listheader align="right" label="%"/>
		</listhead>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="United States"/>
			<listcell label="5,093"/>
			<listcell label="19.39%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="China"/>
			<listcell label="4,274"/>
			<listcell label="16.27%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="France"/>
			<listcell label="1,892"/>
			<listcell label="7.20%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="Germany"/>
			<listcell label="1,846"/>
			<listcell label="7.03%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="Taiwan"/>
			<listcell label="1,384"/>
			<listcell label="5.27%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="United Kingdom"/>
			<listcell label="1,025"/>
			<listcell label="3.90%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="Italy"/>
			<listcell label="921"/>
			<listcell label="3.51%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="Canada"/>
			<listcell label="820"/>
			<listcell label="3.12%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="Brazil"/>
			<listcell label="648"/>
			<listcell label="2.47%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="Spain"/>
			<listcell label="540"/>
			<listcell label="2.06%"/>
		</listitem>
		<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
			<listcell label="(other)"/>
			<listcell label="7,824"/>
			<listcell label="29.79%"/>
		</listitem>
		<listfoot>
			<listfooter label="Total 132"/>
			<listfooter label="26,267"/>
			<listfooter label="100.00%"/>
		</listfoot>
	</listbox>
	<image src="/img/circle.png" draggable="true" mold="alphafix"/>
	<zscript>
	void move(Component dragged) {
		if (dragged instanceof Listitem)
			self.parent.insertBefore(dragged, self);
		else
			alert("Sorry, no food here");
	}
	</zscript>
</window>