This demo allows you to upload an image file from your local machine to the server, which is then in turn sent in the response and displayed in your browser.

In this example,an ordinary button is made to trigger the onUpload event by specifying its "upload" attribute to "true" and implement the onUpload event listener. A native modal window would be evoked prompting users to select the desired file.

<zk>
	<button label="Upload Image" upload="true,maxsize=300">
		<attribute name="onUpload"><![CDATA[
			org.zkoss.util.media.Media media = event.getMedia();
			if (media instanceof org.zkoss.image.Image) {
				org.zkoss.zul.Image image = new org.zkoss.zul.Image();
				image.setContent(media);
				image.setParent(pics);
			} else {
				Messagebox.show("Not an image: "+media, "Error", Messagebox.OK, Messagebox.ERROR);
				break;
			}
		]]></attribute>
	</button>
	<separator />
	<vlayout id="pics" height="360px" style="overflow:auto" />
</zk>