Wednesday, June 6, 2012
ZK Quick Start
This post is the Quick Start guide of ZK, talking about how to getting it started quickly, NO ZK Studio, NO Maven, just the simple clear traditional way.
1. Download Eclipse:
1.1: Go to Eclipse official site (http://www.eclipse.org/, for 2012-06-06)
1.2: Click Downloads
1.3: Click Eclipse IDE for Java EE Developers (I choose 32 Bit version)
1.4: Click download button to download it.
2. Download Tomcat:
2.1: Go to Tomcat official site (http://tomcat.apache.org/, for 2012-06-06)
2.2: Click 'Tomcat 7.0'
2.3: Find the 'Binary Distributions' and download it
3. Download ZK
3.1: Go to ZK official site (http://www.zkoss.org/, for 2012-06-06)
3.2: Click Downloads -> ZK
3.3: Click 'Download ZK CE' to download it
4. Start Eclipse:
4.1: Extract the downloaded file eclipse-jee-indigo-SR2-win32.zip
4.2: Create a workspace folder for Eclipse
4.3: Double-click on eclipse/eclipse.exe to open it, choose the workspace then click 'OK'
4.4: Click 'Workbench' to enter workbench
5. Add Tomcat Server in Eclipse
5.1: Extract the downloaded file apache-tomcat-7.0.27-windows-x86.zip
5.2: Right-click in Eclipse's Servers view -> New -> Server
5.3: Select Apache/Tomcat v7.0 Server, click next
5.4: Choose server folder, click finish
6. Create Test Project
6.1: Click File -> New -> Dynamic Web Project
6.2: Enter Project name then click Finish
6.3: Extract the downloaded file zk-bin-6.0.1.zip
6.4: Copy all jar files under zk-bin-6.0.1\dist\lib to WebContent/WEB-INF/lib
6.5: Copy zk-bin-6.0.1\dist\WEB-INF\web.xml to WebContent/WEB-INF/
6.6: Right-click on WebContent -> New -> File, create a file 'index.zul' under WebContent
6.7: Edit index.zul as below:
7. Run Test Project
7.1: Right-click on server, click Add and Remove
7.2: Select test project, click Add then click Finish
7.3: Click 'Run' button
7.4: Open browser then go to the test project
7.6: Click the test button, a label will appear
Finish
Labels:
ZK
Subscribe to:
Post Comments (Atom)
On Question regarding ZK Chosenbox .Can we use SelectOption class with Chosenbox?Like we can do for ZK combobox where we can show some label to user but if user select some label in backend Java code we can get vale which can be use for DB.
ReplyDeleteCurrently Chosenbox only guess everything are String, but I believe it allows any java bean in ZK 6.5.2.
DeleteDo you know how can we can do it i am using ZK6.5.2 Still did not get any Single Document where someone explain how we can use SelectOption kind of thing with Chosenbox
DeleteI'm not sure what does SelectOption mean, is it something like getSelectedObjects?
Deletehttp://www.zkoss.org/javadoc/latest/zk/org/zkoss/zkmax/zul/Chosenbox.html#getSelectedObjects()
As a previously told you i want to show a label to user but in java code i want to use id for selected item thats why i want to use SelectOption type class..
Deletepublic class SelectOption implements Serializable,
Comparable> {
private static final long serialVersionUID = 1L;
private T value;
private String label;
private String description;
public SelectOption() {
}
public SelectOption(T value) {
this.value = value;
}
public SelectOption(T value, String label) {
this(value);
this.label = label;
}
//get/set methods
In Chosenbox, you can pass any object into model and then it will use Object.toString() as the label to display, after you select some labels, you can get the selected objects via Chosenbox.getSelectedObjects(), is this fits your need? If not, what is your expected action?
DeleteI have created a list
DeleteList mytype;/get,Set Method
and ChooseBoxContainer class have two variables label,value now in ZUl page
Now model have a List of classes of type ChooseBoxContainer.java now how can i show only lable to user i have to use Rendered for that?
Thanks Ben i have done it with itemrendered attribute
DeleteOnly One issue How can i bind these selecteditem with Java class as i did not get any attribute like selecteditem or selecteditems?
DeleteYou can get selected items by
Deletepublic LinkedHashSet<Object> getSelectedObjects ()
in Chosenbox
But i am using MVVM Architecture i did not Wire the Component in this case how can i get selected items?
DeleteYou can bind it in vm since Chosenbox has proper getter/setter
Deletezul:
<chosenbox model="@load(vm.model)"
selectedObjects="@bind(vm.selectedObjects)" />
vm:
public ListModel getModel () {
...
}
public void setSelectedObjects (Set selectedObjects) {
...
}
public Set getSelectedObjects () {
...
}
Thanks Ben but in Documentation these thing not added If possible please add these thing in Zk Official Documentation.
Deletei am getting this exception
Deleteorg.zkoss.zel.ELException: Error writing 'selectedObjects' on type org.zkoss.zkmax.zul.Chosenbox
>>java.lang.NullPointerException
>> at org.zkoss.zkmax.zul.Chosenbox.setSelectedObjects(Chosenbox.java:318)
Maybe you can try the working sample at zkfiddle:
Deletehttp://zkfiddle.org/sample/280tfnd/1-Chosenbox-bind-select-objects
Here sample with Exception..
Deletehttp://zkfiddle.org/sample/280tfnd/2-Chosenbox-bind-select-objects-with-Rendered
DeleteSince you put Container in ListModel, you need to put Container in selectedObjects, too. Below is a working sample works with ZK 6.5.2 or later:
http://zkfiddle.org/sample/280tfnd/3-Chosenbox-bind-select-objects-with-Rendered
By the way, currently chosenbox not works with itemRenderer well, what we can do now is overriding toString and equals (and even hashCode) properly in custom data class.
FYI ...Sorry ben your fiddle example is throwing same exception
DeleteError writing 'selectedObjects' on type org.zkoss.zkmax.zul.Chosenbox on Page rendered and click on the button
Hmm...but it works well for me with ZK EE eval 6.5.2, please refer to the online demo.
Deletehttp://screencast.com/t/4NVFkiiQ4Vl
I was doing three mistakes..
Delete1-I was testing code in fiddle while you mentioed it should work only in zk6.5.2
2-I am not checking for Null inside getSelectdObjet.
3-Using Item rendered i removed item rendered.
Hi Benbai
ReplyDeleteAfter selecting some items in the choosen box, i want to give onClick event of each item. is that possible.
Yes, please refer to sample at gist:
Deletehttps://gist.github.com/benbai123/7332482