Fileupload
Fileupload
- Demonstration: FileUpload
- Java API: Fileupload
- JavaScript API: Fileupload
Employment/Purpose
There are two ways to use Fileupload: uses Fileupload as a component to upload files, or invoke Fileupload.get() to open a dialog to upload files.
Use as a Component
Fileupload itself is a component. You can use it directly as follows.
<fileupload label="Upload">
<attribute name="onLoad">
org.zkoss.util.media.Media media = event.getMedia();
//then, you can process media here
</attribute>
</button>
Fileupload is actually a button with upload=true
. In other words, the above is equivalent to
<button label="Upload" upload="true">
...
Invoke the Static Method: get
Fileupload provides a set of static methods to simplify the file uploading, such as Fileupload.get(), Fileupload.get(String, String), and so on.
The behavior is a little bit different depending on if the event thread is enabled (default: it is disabled). For more information please refer to ZK Configuration Reference: disable-event-thread.
Event Thread Enabled
Event Thread Disabled
Specify the target component
Since 5.0.2, if the event thread is disabled, an onUpload event is posted to all root components when the upload dialog is closed.
If you want the event being sent to a particular component, specify the component in the desktop's attribute called
org.zkoss.zul.Fileupload.target
.
For example,
desktop.setAttribute("org.zkoss.zul.Fileupload.target", mainWindow);
Fileupload.get(); //then mainWindow will receive the onUpload event
Example
<image id="img" />
Upload your hot shot:
<fileupload onUpload="img.setContent(event.media)" />
Supported events
None | None |
Supported Children
*NONE
Use cases
Version | Description | Example Location |
---|---|---|
Version History
Version | Date | Content |
---|---|---|
5.0.2 | May 2010 | Able to specify a target for the onUpload event sent by Fileupload.get(). Used if the event thread is disabled. |