ZK Fiddle - Another new ZK fiddle

Suggested case list:

user model to move item to another listbox

1TonyQ114.25.109.94d0n3krApr 21, 2012 10:43:27 AMlink

Using timer to refresh a grid

1TonyQ220.133.44.3725nk0uiFeb 17, 2012 3:17:34 AMlink

update the textbox value and fire a onChange event (Client)

2TonyQ220.133.44.37qdorurFeb 12, 2012 11:56:25 PMlink

Fire a event from child iframe

1TonyQ220.133.44.372eupjotFeb 3, 2012 5:04:52 AMlink

Textbox input restriction sample

1TonyQ72.21.245.2431b3nlr0Dec 20, 2011 10:09:10 AMlink

Test web core taglib in ZUL

1TonyQ198.203.175.175ofqkemDec 17, 2011 3:36:08 AMlink

identify firefox or not in server side

1TonyQ198.203.175.1751nv2qreDec 10, 2011 4:25:04 AMlink

ZK addThis integration

1TonyQ198.203.175.1751apl96jNov 5, 2011 4:12:50 AMlink

Trigger onChange for textbox in client manually.

1TonyQ198.203.175.1751tmsvs1Sep 22, 2011 5:23:43 AMlink

modify selected status of listbox after compose

1guest61.224.42.2033486viqSep 18, 2011 12:26:53 PMlink

ckeditor startup with source mode

1benbai61.216.4.1961lvlb1lSep 11, 2011 1:56:30 PMlink

apply style to all textbox in css

1TonyQ198.203.175.1751l8b5kkSep 10, 2011 12:55:52 AMlink

Require user to enter uppercase chars only in textbox

1TonyQ198.203.175.1751cl18ghSep 9, 2011 12:58:13 AMlink

The last position that the mouse was clicked

3sunflower60.175.249.16539o3m78Sep 8, 2011 10:08:32 PMlink

How to invoke server side onClick event with XHTML component

1TonyQ198.203.175.17511spe5sSep 7, 2011 8:01:56 AMlink

Client event - onFocus/onBlur

1TonyQ198.203.175.1752met717Sep 1, 2011 6:13:24 AMlink

Databinding with TypeConverter sample

1TonyQ198.203.175.1751t0gtrkAug 31, 2011 12:47:46 AMlink

grid sample with ListModel/RowRenderer

5guest198.203.175.1752vah9ajAug 31, 2011 12:27:35 AMlink

Multiple drag - finetune

3TonyQ198.203.175.175393nlq1Aug 30, 2011 6:49:05 AMlink

A window doModal reusing example - composer way

5TonyQ12.208.243.66126pn69Aug 28, 2011 12:04:14 PMlink

Latest 10 Fiddles :

Include Issue

1guest1.34.109.428ck8ebMay 24, 2013 10:06:44 AMlink

Simple MVVM sample

5guest178.199.113.1313kvld74May 24, 2013 9:52:38 AMlink

Another new ZK fiddle

1guest190.41.64.1183akqhe5May 23, 2013 6:32:30 PMlink

ResNet

68okspry140.182.1.111gibpeaMay 23, 2013 5:10:59 PMlink

ResNet

67okspry140.182.1.111gibpeaMay 23, 2013 5:04:02 PMlink

ResNet

66okspry140.182.1.111gibpeaMay 23, 2013 4:58:01 PMlink

ResNet

65okspry140.182.1.111gibpeaMay 23, 2013 4:55:50 PMlink

ResNet

64okspry140.182.1.111gibpeaMay 23, 2013 4:48:14 PMlink

ResNet

63okspry140.182.1.111gibpeaMay 23, 2013 4:47:50 PMlink

ResNet

62okspry140.182.1.111gibpeaMay 23, 2013 3:41:09 PMlink

Another new ZK fiddle

1guest81.27.116.7tilioiJul 23, 2012 1:31:13 PMlink

resources

index.zulzul<zk xmlns:c="client"> <style> .text-center, .z-combobox-inp, .z-datebox-inp { text-align: center; } div.z-grid-body { #overflow: hidden; } div.z-column-cnt { padding: 7px 0 5px 5px; } tr.z-row td.z-row-inner,div.z-row-cnt { padding: 0 2px; } </style> <zscript><![CDATA[ List status = new java.util.ArrayList(); status.add("Ordered"); status.add("Shipped"); status.add("Awaiting"); status.add("Unavailable"); ListModel lm = new ListModelList(status); Date today = org.zkoss.util.Dates.today(); ]]></zscript> <grid width="850px"> <columns height="22px"> <column width="150px" label="Author"> <image src="/widgets/grid/inline_editing/img/ui-text-field.png" /> </column> <column width="350px" label="Title"> <image src="/widgets/grid/inline_editing/img/ui-text-field.png" /> </column> <column width="100px" label="Publish Date" align="center"> <image src="/widgets/grid/inline_editing/img/calendar-blue.png" /> </column> <column width="150px" label="Hardcover" align="center"> <image src="/widgets/grid/inline_editing/img/control-up-down.png" /> </column> <column width="100px" label="Status" align="center"> <image src="/widgets/grid/inline_editing/img/ui-combo-box-edit.png" /> </column> </columns> <rows> <row> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Philip Hensher" width="99%" /> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="The Fit" width="99%" /> <datebox inplace="true" onChange='self.style="font-weight:bold"' value="${today}" width="99%" format="MM/dd/yyyy" /> <div class='text-center'>  <spinner inplace="true" onChange='self.style="font-weight:bold"' value="240" width="30px" c:onFocus='this.setWidth("55px")' c:onBlur='this.setWidth("30px")' />  <label value="pages" onClick="self.previousSibling.focus=true" /> </div> <combobox width="99%" inplace="true" onChange='self.style="font-weight:bold"' value="Shipped" model="${lm}" /> </row> <row> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Philip Hensher" width="99%" /> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Kitchen Venom" width="99%" /> <datebox inplace="true" onChange='self.style="font-weight:bold"' value="${today}" width="99%" format="MM/dd/yyyy" /> <div class='text-center'> <spinner inplace="true" onChange='self.style="font-weight:bold"' value="336" width="30px" c:onFocus='this.setWidth("55px")' c:onBlur='this.setWidth("30px")' /> <label value="pages" onClick="self.previousSibling.focus=true" /> </div> <combobox width="99%" inplace="true" onChange='self.style="font-weight:bold"' value="Awaiting" model="${lm}" /> </row> <row> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Michael Greenberg" width="99%" /> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Hurry Down Sunshine" width="99%" /> <datebox inplace="true" onChange='self.style="font-weight:bold"' value="${today}" width="99%" format="MM/dd/yyyy" /> <div class='text-center'> <spinner inplace="true" onChange='self.style="font-weight:bold"' value="245" width="30px" c:onFocus='this.setWidth("55px")' c:onBlur='this.setWidth("30px")' /> <label value="pages" onClick="self.previousSibling.focus=true" /> </div> <combobox width="99%" inplace="true" onChange='self.style="font-weight:bold"' value="Awaiting" model="${lm}" /> </row> <row> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Michael Greenberg" width="99%" /> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Painless Vocabulary (Painless)" width="99%" /> <datebox inplace="true" onChange='self.style="font-weight:bold"' value="${today}" width="99%" format="MM/dd/yyyy" /> <div class='text-center'> <spinner inplace="true" onChange='self.style="font-weight:bold"' value="292" width="30px" c:onFocus='this.setWidth("55px")' c:onBlur='this.setWidth("30px")' /> <label value="pages" onClick="self.previousSibling.focus=true" /> </div> <combobox width="99%" inplace="true" onChange='self.style="font-weight:bold"' value="Ordered" model="${lm}" /> </row> <row> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Rick Perlstein" width="99%" /> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Nixonland: The Rise of a President and the Fracturing of America" width="99%" /> <datebox inplace="true" onChange='self.style="font-weight:bold"' value="${today}" width="99%" format="MM/dd/yyyy" /> <div class='text-center'> <spinner inplace="true" onChange='self.style="font-weight:bold"' value="896" width="30px" c:onFocus='this.setWidth("55px")' c:onBlur='this.setWidth("30px")' /> <label value="pages" onClick="self.previousSibling.focus=true" /> </div> <combobox width="99%" inplace="true" onChange='self.style="font-weight:bold"' value="Unavailable" model="${lm}" /> </row> <row> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Rick Perlstein" /> <textbox inplace="true" onChange='self.style="font-weight:bold"' value="Nixonland" /> <datebox inplace="true" onChange='self.style="font-weight:bold"' value="${today}" width="99%" format="MM/dd/yyyy" /> <div class='text-center'> <spinner inplace="true" onChange='self.style="font-weight:bold"' value="845" width="30px" c:onFocus='this.setWidth("55px")' c:onBlur='this.setWidth("30px")' /> <label value="pages" onClick="self.previousSibling.focus=true" /> </div> <combobox width="99%" inplace="true" onChange='self.style="font-weight:bold"' value="Awaiting" model="${lm}" /> </row> </rows> </grid> </zk>TestComposer.javajavaimport org.zkoss.zk.ui.*; import org.zkoss.zk.ui.event.*; import org.zkoss.zk.ui.util.*; import org.zkoss.zk.ui.ext.*; import org.zkoss.zk.au.*; import org.zkoss.zk.au.out.*; import org.zkoss.zul.*; public class TestComposer extends GenericForwardComposer{ public void doAfterCompose(Component comp) throws Exception { super.doAfterCompose(comp); } public void onClick$btn(Event e){ try { Messagebox.show("Hi btn"); } catch (InterruptedException ex) { ex.printStackTrace(); } } }