-
FEATURED COMPONENTS
First time here? Check out the FAQ!
I am working on a application in ZK
1) I have a tree on left left .
2) Corresponding details of particular node on right side (with a 'Textbox' & 'save' button)
I want to add a node dynamically on clicking 'Save' button with the updated value of textbox.
Ex: if textbox value is "abcd" then a node of name "abcd" should be created.
How can i do this?
Hi, cros
Could you post your zul file
//jimmy
THIS IS MY Client.zul
<zk xmlns="http://www.zkoss.org/2005/zul"
xmlns:h="http://www.w3.org/1999/xhtml"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.zkoss.org/2005/zul http://www.zkoss.org/2005/zul/zul.xsd">
<include src="/topmenu.zul"/>
<window width="99%" height="93%" border="normal" apply="PatientCrudComposer">
<borderlayout>
<north border="none">
<label id="statusBar"/>
</north>
<west size="20%"> <!-- splittable="true" flex="true" -->
<vbox spacing="0" width="100%" >
<menubar id="submenubarlist" orient="horizontal" >
<menuitem id="menuNew" label="New" />
</menubar>
<tree id="treeClient" >
<treechildren>
<treeitem open="false">
<treerow draggable="true" onDrop="move(event.dragged)">
<treecell label="Hospital" />
</treerow>
<treechildren>
<treeitem>
<treerow draggable="true" >
<treecell label="Hospital1" />
</treerow>
</treeitem>
<treeitem>
<treerow draggable="true">
<treecell label="Hospital2" />
</treerow>
</treeitem>
</treechildren>
</treeitem>
<treeitem open="false">
<treerow draggable="true" onDrop="move(event.dragged)">
<treecell label="Clinic" />
</treerow>
<treechildren>
<treeitem>
<treerow draggable="true">
<treecell label="Clinic1" />
</treerow>
</treeitem>
<treeitem>
<treerow draggable="true">
<treecell label="Clinic2" />
</treerow>
</treeitem>
</treechildren>
</treeitem>
<treeitem open="false">
<treerow droppable="true"
onDrop="move(event.dragged)">
<treecell label="Lab" />
</treerow>
<treechildren>
<treeitem>
<treerow draggable="true">
<treecell label="Lab1" />
</treerow>
</treeitem>
<treeitem>
<treerow draggable="true">
<treecell label="Lab2" />
</treerow>
</treeitem>
</treechildren>
</treeitem>
<treeitem open="false">
<treerow droppable="true"
onDrop="move(event.dragged)">
<treecell label="Facility" />
</treerow>
<treechildren>
<treeitem>
<treerow draggable="true">
<treecell label="Facility1" />
</treerow>
</treeitem>
<treeitem>
<treerow draggable="true">
<treecell label="Facility2" />
</treerow>
</treeitem>
</treechildren>
</treeitem>
</treechildren>
</tree>
</vbox>
</west>
<center>
<vbox spacing="0">
<menubar id="submenubaredit" orient="horizontal">
<menuitem id="menuSave" label="Save" />
</menubar>
<tabbox>
<tabs>
<tab id="tabMain" label="Main"/>
</tabs>
<tabpanels>
<tabpanel>
<vbox spacing="0" width="100%">
<label value="Hospitals" id="nameHospital"/>
<hbox spacing="0" id="boxHospital">
<vbox spacing="0">
<menubar id="subsubmenubarHospitalEdit" orient="horizontal">
<menuitem id="menuSaveHospital" label="Save" />
</menubar>
<listbox id="gridCtlHospitalItem">
<listhead sizable="true">
<listheader label="Name"/>
<listheader label="Value"/>
</listhead>
<listitem><listcell>Type:</listcell> <listcell><combobox id="HospitalType" autodrop="true"/></listcell></listitem>
<listitem><listcell>Name:</listcell> <listcell><textbox id="HospitalName" /></listcell></listitem>
<listitem><listcell>Parent:</listcell> <listcell><textbox id="HospitalParent" /></listcell></listitem>
<listitem><listcell>Billable:</listcell> <listcell><checkbox id="HospitalBillable"/></listcell></listitem>
</listbox>
</vbox>
</hbox>
<label value="Clinics" id="nameClinic"/>
<hbox spacing="0" id="boxClinic">
<vbox spacing="0">
<menubar id="subsubmenubarClinicEdit" orient="horizontal">
<menuitem id="menuSaveClinic" label="Save" />
</menubar>
<listbox id="gridCtlClinicItem">
<listhead sizable="true">
<listheader label="Name"/>
<listheader label="Value"/>
</listhead>
<listitem><listcell>Type:</listcell> <listcell><combobox id="ClinicType" autodrop="true"/></listcell></listitem>
<listitem><listcell>Name:</listcell> <listcell><textbox id="ClinicName" /></listcell></listitem>
<listitem><listcell>Parent:</listcell> <listcell><textbox id="ClinicParent" /></listcell></listitem>
<listitem><listcell>Billable:</listcell> <listcell><checkbox id="ClinicBillable"/></listcell></listitem>
</listbox>
</vbox>
</hbox>
<label value="Labs" id="nameLabs"/>
<hbox spacing="0" id="boxLab">
<vbox spacing="0">
<menubar id="subsubmenubarLabEdit" orient="horizontal">
<menuitem id="menuSaveLab" label="Save" />
</menubar>
<listbox id="gridCtlLabItem" >
<listhead sizable="true">
<listheader label="Name"/>
<listheader label="Value"/>
</listhead>
<listitem><listcell>Type:</listcell> <listcell><combobox id="LabType" autodrop="true"/></listcell></listitem>
<listitem><listcell>Name:</listcell> <listcell><textbox id="LabName" /></listcell></listitem>
<listitem><listcell>Parent:</listcell> <listcell><textbox id="LabParent" /></listcell></listitem>
</listbox>
</vbox>
</hbox>
</vbox>
</tabpanel>
</tabpanels>
</tabbox>
</vbox>
</center>
</borderlayout>
<zscript><![CDATA[
void move(Component dragged) {
self.parent.insertBefore(dragged, self.getNextSibling());
self.appendChild(dragged);
}
treeClient.onSelect = { ev ->
Treeitem itemSelected = treeClient.getSelectedItem()
def id = itemSelected.label
nameHospital.value=id
enableEditControls(false)
}
menuNew.onClick = { ev ->
//gridCtlAddress.setSelectedIndex(-1)
enableEditControls(false)
nameHospital.setVisible(false)
clearEditValues()
}
clearEditValues = {
HospitalType.value = null
HospitalName.value = null
HospitalParent.value = null
HospitalBillable.checked = false
}
menuSave.onClick = { ev ->
}
// Main Client Edit Area
enableEditControls = { e ->
nameClinic.setVisible(e)
nameLabs.setVisible(e)
boxClinic.setVisible(e)
boxLab.setVisible(e)
nameHospital.setVisible(true)
}
// Main init routine
init = {
HospitalType.setModel(new SimpleListModel(Client.constraints.type.inList))
enableEditControls(false)
nameHospital.setVisible(false)
statusBar.value = "Ready"
}
init()
]]></zscript>
</window>
</zk>
Hi,cros
I write a sample
zul file
<window apply="ctrl.Composer"> <tree id="treeClient"> <treechildren> <treeitem open="false"> <treerow draggable="true" onDrop="move(event.dragged)"> <treecell label="Hospital" /> </treerow> <treechildren> <treeitem> <treerow draggable="true"> <treecell label="Hospital1" /> </treerow> </treeitem> <treeitem> <treerow draggable="true"> <treecell label="Hospital2" /> </treerow> </treeitem> </treechildren> </treeitem> <treeitem open="false"> <treerow draggable="true" onDrop="move(event.dragged)"> <treecell label="Clinic" /> </treerow> <treechildren> <treeitem> <treerow draggable="true"> <treecell label="Clinic1" /> </treerow> </treeitem> <treeitem> <treerow draggable="true"> <treecell label="Clinic2" /> </treerow> </treeitem> </treechildren> </treeitem> <treeitem open="false"> <treerow droppable="true" onDrop="move(event.dragged)"> <treecell label="Lab" /> </treerow> <treechildren> <treeitem> <treerow draggable="true"> <treecell label="Lab1" /> </treerow> </treeitem> <treeitem> <treerow draggable="true"> <treecell label="Lab2" /> </treerow> </treeitem> </treechildren> </treeitem> <treeitem open="false"> <treerow droppable="true" onDrop="move(event.dragged)"> <treecell label="Facility" /> </treerow> <treechildren> <treeitem> <treerow draggable="true"> <treecell label="Facility1" /> </treerow> </treeitem> <treeitem> <treerow draggable="true"> <treecell label="Facility2" /> </treerow> </treeitem> </treechildren> </treeitem> </treechildren> </tree> <hbox> <hbox spacing="0" id="boxHospital"> <vbox spacing="0"> <label value="Hospitals" id="nameHospital" /> <menubar id="subsubmenubarHospitalEdit" orient="horizontal"> <menuitem id="menuSaveHospital" label="Save" /> </menubar> <listbox id="gridCtlHospitalItem"> <listhead sizable="true"> <listheader label="Name" /> <listheader label="Value" /> </listhead> <listitem> <listcell>Type:</listcell> <listcell> <combobox id="HospitalType" autodrop="true" /> </listcell> </listitem> <listitem> <listcell>Name:</listcell> <listcell> <textbox id="HospitalName" /> </listcell> </listitem> <listitem> <listcell>Parent:</listcell> <listcell> <textbox id="HospitalParent" /> </listcell> </listitem> <listitem> <listcell>Billable:</listcell> <listcell> <checkbox id="HospitalBillable" /> </listcell> </listitem> </listbox> </vbox> </hbox> <hbox spacing="0" id="boxClinic"> <vbox spacing="0"> <label value="Clinics" id="nameClinic" /> <menubar id="subsubmenubarClinicEdit" orient="horizontal"> <menuitem id="menuSaveClinic" label="Save" /> </menubar> <listbox id="gridCtlClinicItem"> <listhead sizable="true"> <listheader label="Name" /> <listheader label="Value" /> </listhead> <listitem> <listcell>Type:</listcell> <listcell> <combobox id="ClinicType" autodrop="true" /> </listcell> </listitem> <listitem> <listcell>Name:</listcell> <listcell> <textbox id="ClinicName" /> </listcell> </listitem> <listitem> <listcell>Parent:</listcell> <listcell> <textbox id="ClinicParent" /> </listcell> </listitem> <listitem> <listcell>Billable:</listcell> <listcell> <checkbox id="ClinicBillable" /> </listcell> </listitem> </listbox> </vbox> </hbox> <hbox spacing="0" id="boxLab"> <vbox spacing="0"> <label value="Labs" id="nameLabs" /> <menubar id="subsubmenubarLabEdit" orient="horizontal"> <menuitem id="menuSaveLab" label="Save" /> </menubar> <listbox id="gridCtlLabItem"> <listhead sizable="true"> <listheader label="Name" /> <listheader label="Value" /> </listhead> <listitem> <listcell>Type:</listcell> <listcell> <combobox id="LabType" autodrop="true" /> </listcell> </listitem> <listitem> <listcell>Name:</listcell> <listcell> <textbox id="LabName" /> </listcell> </listitem> <listitem> <listcell>Parent:</listcell> <listcell> <textbox id="LabParent" /> </listcell> </listitem> </listbox> </vbox> </hbox> </hbox> </window>
Composer.java
import org.zkoss.zk.ui.Component; import org.zkoss.zk.ui.util.GenericForwardComposer; import org.zkoss.zul.*; public class Composer extends GenericForwardComposer { private Textbox HospitalName,HospitalParent; private Tree treeClient; @Override public void doAfterCompose(Component comp) throws Exception { super.doAfterCompose(comp); } public void onClick$menuSaveHospital() { String parentName = HospitalParent.getValue(); Treeitem parent = null; for(Object treeItem:treeClient.getItems()){ Treerow treeRow = ((Treeitem)treeItem).getTreerow(); Treecell treeCell = (Treecell)treeRow.getFirstChild(); if(treeCell.getLabel().equals(parentName)){ parent = (Treeitem)treeItem; break; } } if(parent == null)return; Treechildren treeChildren = parent.getTreechildren(); if(treeChildren == null){ treeChildren = new Treechildren(); parent.appendChild(treeChildren); } Treeitem ti =new Treeitem(); Treerow tr = new Treerow(); tr.appendChild(new Treecell(HospitalName.getValue())); tr.setParent(ti); treeChildren.appendChild(ti); } }
//jimmy
Hi jimmy,
can u help me to solve the problem in tree.
using property multiple="true" checkmark="true" check boxes are created in tree.
now problem is that
-- A
--a
--b
--c
-- B
--p
--q
--r
A is the parent of a,b,c
B is the parent of p,q,r
-- means check box.
when i click on A check box then its child a,b,c check box need be selected.
when i click on B check box then its child a,b,c check box need be selected.
if we r click on A or B Check Box are not select and its child a,c and p,q check boxes are selected.
then v need to store check box value in database is select then 1 otherwise 0.
now how v get the check box value in the code so that v find whether check box is selected or not.
and how v got check box component.
because check boxes are created using property multiple="true" checkmark="true".
pls find the sloution and tell me.
Regard's
Pardeep Garg
please don't crosspost .
Asked: 2009-10-01 12:04:27 +0800
Seen: 847 times
Last updated: Dec 21 '10