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 :

ComboBox - Selection with Checkboxes

4guest162.158.50.234elaaadMay 29, 2020 12:24:18 PMlink

ComboBox - Selection with Checkboxes

3guest162.158.50.228elaaadMay 29, 2020 12:23:29 PMlink

ComboBox - Selection with Checkboxes

2guest172.69.135.212elaaadMay 29, 2020 12:21:47 PMlink

Bug in _fixTabsScrollLeft

3guest162.158.183.1933df8b6hMay 29, 2020 10:08:46 AMlink

Bug in _fixTabsScrollLeft

2guest162.158.183.1933df8b6hMay 29, 2020 10:07:28 AMlink

Bug in _fixTabsScrollLeft

1guest162.158.183.1393df8b6hMay 29, 2020 9:45:51 AMlink

listbox-horizontal-scroll-in-listbody-covers-rows-content

47guest188.114.110.2142mcqgieMay 29, 2020 9:26:57 AMlink

1 button

1hawk108.162.215.1941av3k2pMay 29, 2020 7:17:11 AMlink

Listheader keep visible state

1guest198.41.231.1032t3h3peMay 28, 2020 7:19:15 PMlink

Custom converter example MVVM

2guest162.158.225.16029mfhsrMay 28, 2020 3:40:03 PMlink

Listbox auto scroll while dragging

31guest170.247.0.2061c267mkJun 11, 2019 9:47:29 PMlink

resources

index.zulzul<zk> <script type="text/javascript"><![CDATA[ var oldUpdateDrag = zk.Draggable.prototype._updateDrag; zk.afterLoad("zk", function () { zk.Draggable.prototype._updateDrag = function (pt, evt) { oldUpdateDrag.apply(this, arguments); var control = this.control, node = this.node; if (control.$instanceof(zul.sel.Listitem)) { var listbox = control.getListbox(), dir; if (dir = shouldScroll(node, listbox)) startScroll(dir, listbox); else clearScroll(listbox); } } }); function shouldScroll (node, listbox) { var $listbox = jq(listbox.$n('body')), $node = jq(node), top = $listbox.offset().top, itemTop = $node.offset().top; if (itemTop < top) return 'up'; else { var bottom = top + $listbox.height(), itemBottom = itemTop + $node.height(); return itemBottom > bottom? 'down' : null; } } function startScroll (dir, listbox) { if (!listbox._scrollStarted) listbox._scrollStarted = setInterval(function () { var body = listbox.$n('body'), oldValue = body.scrollTop; body.scrollTop += dir == 'down'? 20 : (-20); // can not scroll any more if (body.scrollTop == oldValue) clearScroll(listbox); }, 50); } function clearScroll(listbox) { if (listbox._scrollStarted) { clearInterval(listbox._scrollStarted); listbox._scrollStarted = null; } } ]]></script> <window title="scroll while drag" border="normal"> <listbox id="left" height="150px" width="200px" onDrop="move(event.dragged)" droppable="true" oddRowSclass="non-odd"> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK Forge" /> </listitem> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK Mobile" /> </listitem> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK GWT" /> </listitem> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK JSF" /> </listitem> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK JSP" /> </listitem> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK Spring" /> </listitem> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK" /> </listitem> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK Studio" /> </listitem> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK Jquery" /> </listitem> <listitem draggable="true" droppable="true" onDrop="move(event.dragged)"> <listcell label="ZK JS" /> </listitem> </listbox> <separator /> </window> <zscript> void move(Component dragged) { if (self instanceof Listitem) { self.parent.insertBefore(dragged, self.getNextSibling()); } else { self.appendChild(dragged); } } </zscript> <button label="test" draggable="true" /> </zk>