Theme:
Processing...
Description & Source Code

The "include" component allows a page to include other pages,
such as ZUML, JSP, and JSF.

In this example, the "includedHello.zul" page
(a ZK groupbox containing a progress meter, spinner and a check box) is embedded in the page using the include component.
Each included page is itself a space owner.

include.zul
<include src="/widgets/composite/include/includedHello.zul"/>
			
includedHello.zul
<groupbox id="gb" mold="3d" width="400px">
	<caption label="This is an included component" />
	<vlayout>
		<hlayout>
			Progress meter:
			<separator orient="vertical" spacing="3px" /> 
			<progressmeter id="pm" value="20" />
		</hlayout>
		<separator spacing="5px" />
		<hlayout>
			Adjust spinner:
			<separator orient="vertical" spacing="3px" />
			<spinner id="sp" step="5" value="${pm.value}"
				constraint="min 0 max 100"
				onChanging="pm.setValue(Integer.parseInt(event.value))"
				onChange="pm.value = sp.value" cols="3" readonly="true" />				
		</hlayout>
	</vlayout>
</groupbox>