Processing...

Suggested case list:

Using timer to refresh a grid

383guest172.69.33.12125nk0uiMay 7, 2020 7:23:47 AMlink

user model to move item to another listbox

120guest162.158.193.148d0n3krApr 2, 2020 5:28:28 AMlink

Disabled list item row passed to VM-1981

296fatih123160.83.36.13025nk0uiFeb 13, 2018 4:25:44 PMlink

Disabled list item row passed to VM-1981

295fatih123160.83.36.13025nk0uiFeb 13, 2018 4:25:16 PMlink

Disabled list item row passed to VM-1981

294fatih123160.83.36.13225nk0uiFeb 13, 2018 3:30:44 PMlink

grid sample with ListModel/RowRenderer

816guest80.82.2.1312vah9ajFeb 21, 2017 11:42:21 AMlink

grid sample with ListModel/RowRenderer

809guest175.98.113.1622vah9ajJan 26, 2017 9:19:33 AMlink

grid sample with ListModel/RowRenderer

196guest79.185.142.402vah9ajApr 26, 2014 10:53:57 PMlink

grid sample with ListModel/RowRenderer

195guest79.185.142.402vah9ajApr 26, 2014 10:53:54 PMlink

grid sample with ListModel/RowRenderer

194guest79.185.142.402vah9ajApr 26, 2014 10:53:51 PMlink

grid sample with ListModel/RowRenderer

193guest79.185.142.402vah9ajApr 26, 2014 10:53:48 PMlink

grid sample with ListModel/RowRenderer

192guest79.185.142.402vah9ajApr 26, 2014 10:53:44 PMlink

grid sample with ListModel/RowRenderer

191guest79.185.142.402vah9ajApr 26, 2014 10:53:40 PMlink

Hierarchy table without using ZK PE/EE

1aaknai151.28.135.2131s871daJul 29, 2013 11:02:46 PMlink

grid sample with ListModel/RowRenderer

128aaknai151.28.135.2132vah9ajJul 29, 2013 7:20:00 PMlink

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

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

Latest 10 Fiddles :

Textbox input restriction sample

1guest172.71.137.1339ahuuhJan 12, 2025 6:43:16 AMlink

ZK MVVM Converter

21guest172.71.137.13816cf90oJan 12, 2025 6:35:27 AMlink

Template composition and include

35guest172.70.246.66vroi36Jan 10, 2025 3:44:06 PMlink

Template composition and include

34guest172.70.246.66vroi36Jan 10, 2025 3:43:42 PMlink

Template composition and include

33guest172.70.246.66vroi36Jan 10, 2025 3:42:59 PMlink

Template composition and include

32guest172.70.246.67vroi36Jan 10, 2025 3:41:58 PMlink

Template composition and include

31guest172.70.246.66vroi36Jan 10, 2025 3:41:25 PMlink

Template composition and include

30guest172.70.246.66vroi36Jan 10, 2025 3:39:35 PMlink

Template composition and include

29guest172.70.246.66vroi36Jan 10, 2025 3:39:09 PMlink

Template composition and include

28guest172.70.246.67vroi36Jan 10, 2025 3:37:54 PMlink

create combobox

82guest181.208.10.421gibpeaNov 30, 2013 3:31:25 PMlink

resources

index.zulzul<zk> <style> html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after{content:"";content:none}q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0} .wrapper { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 16px; } /************Clear Button Styles**************/ .z-button .z-button-tl, .z-button .z-button-tr, .z-button .z-button-bl, .z-button .z-button-br, .z-button .z-button-tm, .z-button .z-button-bm, .z-button .z-button-cl, .z-button .z-button-cr, .z-button .z-button-cm { background-image: none; border: none; color: #f8f8f8; font: 1.05em Arial, "Helvetica Neue", Helvetica, sans-serif; padding: 0; } /*************Bandbox, Combobox, and Datebox Styles******************/ .z-combobox-inp, .z-bandbox-inp, .z-datebox-inp, .z-textbox { padding: 0; padding-left: 6px; height: 30px; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 16px; font-weight: normal; background: #f8f8f8; border: 1px solid #bbb; } .duo .z-combobox-inp, .duo .z-bandbox-inp, .duo .z-datebox-inp, .duo .z-textbox { border-right: none; } .z-combobox .z-combobox-btn, .z-bandbox .z-bandbox-btn { background: #f8f8f8 no-repeat 2px 7px; background-image: url('http://cdn1.iconfinder.com/data/icons/fatcow/16/bullet_arrow_down.png'); cursor: pointer; border: 1px solid #bbb; border-left: 0; vertical-align: top; width: 20px; height: 30px; display: -moz-inline-box; display: inline-block; } .z-datebox .z-datebox-btn { background: #f8f8f8 no-repeat 0 6px; background-image: url('http://cdn1.iconfinder.com/data/icons/iPhone_Sidebar/png/Calendar.png'); border: 0; overflow: hidden; padding: 0; display: -moz-inline-box; display: inline-block; margin-left: -20px; margin-top: 2px; } .z-calendar { background: #f8f8f8; border: 1px solid #bbb; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 14px; font-weight: normal; width: 250px; padding: 5px; } .z-calendar-seld {background: #ddd;} .z-combobox-pp { display: block; position: absolute; z-index: 88000; background: #f8f8f8; border: 1px solid #bbb; padding: 5px; font-size:16px; overflow: auto; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: normal; } .z-combobox-pp .z-comboitem-text { white-space: nowrap; font-size: 1.3em; line-height: 1.1em; padding: 6px 14px; cursor: pointer; } .z-combobox-pp .z-comboitem-inner { color: #999; font-size: .8em; padding-left: 0px; margin-left: 9px; } .comboLink { color: #444; text-decoration: none; } .comboLink:hover { background-color: #444; background-image: none; color: #f8f8f8; } .comboLink:active { background-color: #444; color: #ddd; } /************Listbox Styles***************/ div.z-listfooter-cnt, div.z-listcell-cnt, div.z-listheader-cnt{ font-size: 15px; } tr.z-listitem, tr.z-listitem a, tr.z-listitem a:visited {font-size: 1em; font-weight: normal; color: black; text-decoration: none;} tr.z-listitem td.z-listitem-focus {background-image: none;} tr.z-listitem-seld { background-color: #84C5D6; border: none; -moz-box-shadow: 0 0 5px 2px #59ACC1 inset; -webkit-box-shadow: 0 0 5px 2px #59ACC1 inset; box-shadow: 0 0 5px 2px #59ACC1 inset; color: #59ACC1; text-shadow: 1px 1px 1px #E3F6F9; } tr.z-listitem-over { background-color: #84C5D6; border: none; color: #E3F6F9; cursor: pointer; text-shadow: 1px 1px 1px #59ACC1; } tr.z-listitem-over-seld {background: none;} /************Header Styles***************/ .header { background-color: rgba(68, 68, 68, .9); padding: 10px 10px 0 10px; height: 66px; width: 100%; z-index: -1; } .header div:nth-child(2) { position: absolute; top: 45px; } .header div:last-child { position: absolute; right: 10px; top: 7px; } /**********Search Div Internal Positions************/ .combobox { position: absolute; } .searchbox { position: absolute; left: 159px; } .bandpopup { padding: 10px; } .bandpopup .z-vbox {margin: 8px} .header div:first-child .button { position: absolute; left: 378px; } /**********Button Styles*************/ .button { height: 30px; padding: 0 5px; } .list-btn { background-color: transparent; text-shadow: 1px 1px 1px #000; } .list-btn:active, .selected { background-color: #424242; -moz-box-shadow: 0 0 4px 3px #3a3a3a inset, 0 -4px 1px 0 rgba(255, 183, 252, .8) inset, 0 -6px 8px 0 rgba(255, 183, 252, .3) inset; -webkit-box-shadow: 0 0 4px 3px #3a3a3a inset, 0 -4px 1px 0 rgba(255, 183, 252, .8) inset, 0 -6px 8px 0 rgba(255, 183, 252, .3) inset; box-shadow: 0 0 4px 3px #3a3a3a inset, 0 -4px 1px 0 rgba(255, 183, 252, .8) inset, 0 -6px 8px 0 rgba(255, 183, 252, .3) inset; } .action-btn { background-color: #84C5D6; color: #E3F6F9; text-shadow: 1px 1px 1px #4B6E77; } .action-btn:active { -moz-box-shadow: 0 0 8px 2px #4B6E77 inset; -webkit-box-shadow: 0 0 8px 2px #4B6E77 inset; box-shadow: 0 0 8px 2px #4B6E77 inset; color: #59ACC1; text-shadow: 1px 1px 1px #59ACC1; } /*********Content Area Styles***************/ .content {padding: 10px;} .list-name { color: #333745; font: 1.4em bold Arial, "Helvetica Neue", Helvetica, sans-serif; position: relative; top: 5px; } .content .button { position: absolute; right: 12px; margin-top: 5px; } .table span {font-size: 1em;} .tableheader { background-color: #8E658D; color: #eee; padding: 5px; text-align:left; } .cell {padding: 5px;} .table span.primary-info { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 1em; } .table span.secondary-info { font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif; font-size: 1em; margin-right: 4px; } .table span.adjoin {font-size: .9em;} </style> <div sclass="wrapper"> <div sclass="header"> <div> <combobox width="150px" sclass="combobox duo" value="Appointments"> <comboitem label="Appointments" description="show appointments" sclass="comboLink"/> <comboitem label="Encounters" description="show encounters" sclass="comboLink"/> </combobox> <bandbox sclass="searchbox duo"> <bandpopup sclass="bandpopup"> <vbox> Patient Name/MRN<textbox width="200px"/> </vbox> <vbox> Clinic<combobox sclass="duo"> <comboitem label="BB MED" sclass="comboLink"/> <comboitem label="PCC4" sclass="comboLink"/> </combobox> </vbox> <vbox> Study<combobox sclass="duo"> <comboitem label="SRFit" sclass="comboLink"/> <comboitem label="Study2" sclass="comboLink"/> </combobox> </vbox> <vbox> Date Range<hbox> <datebox cols="20" format="yyyy/MM/dd" onCreate="self.value = new Date()"/> <datebox cols="20" format="yyyy/MM/dd" onCreate="self.value = new Date()"/> </hbox> </vbox> <button sclass="button action-btn" label="Search"/> </bandpopup> </bandbox> <button sclass="button action-btn" label="Search"/> </div> <div> <button sclass="button list-btn selected" label="Weekly Schedule"/> <button sclass="button list-btn" label="Daily Schedule"/> <button sclass="button list-btn" label="Patients Missing Enrollment"/> </div> <div> <button sclass="button action-btn" label="Export User Reports"/> <button sclass="button action-btn" label="Print Mental Health Form"/> </div> </div> <div sclass="content"> <div> <label sclass="list-name" value="Weekly Schedule"/> <listbox rows="1" mold="select" sclass="selectbox"> <listitem label="BB MED" selected="true"/> <listitem label="PCC 4"/> <listitem label="WS MED"/> </listbox> <button sclass="button action-btn" label="Print List"/> <listbox zclass="table"> <listhead> <listheader sclass="tableheader" align="left" width="40%" sort="auto"> <span>Person</span> </listheader> <listheader sclass="tableheader" align="left" width="20%" sort="auto"> <span>Eligible Studies</span> </listheader> <listheader sclass="tableheader" align="left" width="40%" sort="auto"> <span>Last Appointment</span> </listheader> </listhead> <listitem> <listcell sclass="cell"> <span sclass="primary-info">Brown, Buster</span> <span sclass="primary-info">(3333333)</span> <span sclass="secondary-info">78yrs</span> <span sclass="secondary-info">White/Non-Hispanic</span> <span sclass="secondary-info">Male</span> <span sclass="secondary-info">(317) 777-3343</span> </listcell> <listcell sclass="cell"> <span sclass="secondary-info">SRFit</span> </listcell> <listcell sclass="cell"> <span sclass="secondary-info">12-Apr-2012</span> <span sclass="secondary-info">09:40</span> <span sclass="secondary-info adjoin">with</span> <span sclass="secondary-info">MACMACKLEY, MAC M</span> <span sclass="secondary-info adjoin">@</span> <span sclass="secondary-info">Blackburn Care</span> </listcell> </listitem> <listitem> <listcell sclass="cell"> <span sclass="primary-info">Brown, Buster</span> <span sclass="primary-info">(3333333)</span> <span sclass="secondary-info">78yrs</span> <span sclass="secondary-info">White/Non-Hispanic</span> <span sclass="secondary-info">Male</span> <span sclass="secondary-info">(317) 777-3343</span> </listcell> <listcell sclass="cell"> <span sclass="secondary-info">SRFit</span> </listcell> <listcell sclass="cell"> <span sclass="secondary-info">12-Apr-2012</span> <span sclass="secondary-info">09:40</span> <span sclass="secondary-info adjoin">with</span> <span sclass="secondary-info">MACMACKLEY, MAC M</span> <span sclass="secondary-info adjoin">@</span> <span sclass="secondary-info">Blackburn Care</span> </listcell> </listitem> <listitem> <listcell sclass="cell"> <span sclass="primary-info">Brown, Buster</span> <span sclass="primary-info">(3333333)</span> <span sclass="secondary-info">78yrs</span> <span sclass="secondary-info">White/Non-Hispanic</span> <span sclass="secondary-info">Male</span> <span sclass="secondary-info">(317) 777-3343</span> </listcell> <listcell sclass="cell"> <span sclass="secondary-info">SRFit</span> </listcell> <listcell sclass="cell"> <span sclass="secondary-info">12-Apr-2012</span> <span sclass="secondary-info">09:40</span> <span sclass="secondary-info adjoin">with</span> <span sclass="secondary-info">MACMACKLEY, MAC M</span> <span sclass="secondary-info adjoin">@</span> <span sclass="secondary-info">Blackburn Care</span> </listcell> </listitem> <listitem> <listcell sclass="cell"> <span sclass="primary-info">Brown, Buster</span> <span sclass="primary-info">(3333333)</span> <span sclass="secondary-info">78yrs</span> <span sclass="secondary-info">White/Non-Hispanic</span> <span sclass="secondary-info">Male</span> <span sclass="secondary-info">(317) 777-3343</span> </listcell> <listcell sclass="cell"> <span class="secondary-info">SRFit</span> </listcell> <listcell sclass="cell"> <span sclass="secondary-info">12-Apr-2012</span> <span sclass="secondary-info">09:40</span> <span sclass="secondary-info adjoin">with</span> <span sclass="secondary-info">MACMACKLEY, MAC M</span> <span sclass="secondary-info adjoin">@</span> <span sclass="secondary-info">Blackburn Care</span> </listcell> </listitem> </listbox> </div> </div> </div> </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) throws InterruptedException{ Messagebox.show("Hi btn"); } }