Suggested case list:

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

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

Latest 10 Fiddles :

grid sample with ListModel/RowRenderer

954guest201.249.105.2352vah9ajNov 19, 2017 3:04:38 PMlink

PDF Viewer in ZK using Iframe

1guest61.231.31.2382s4im3lNov 19, 2017 6:23:23 AMlink

PDF Viewer in ZK using Iframe

1guest61.231.31.23828141iaNov 19, 2017 6:23:20 AMlink

PDF Viewer in ZK using Iframe

2guest61.231.31.23822kk5dnNov 19, 2017 6:23:19 AMlink

PDF Viewer in ZK using Iframe

1guest61.231.31.23822kk5dnNov 19, 2017 6:22:58 AMlink

PDF Viewer in ZK using Iframe

1guest61.231.31.2381m5qehnNov 19, 2017 6:22:54 AMlink

Video Player

161guest78.176.13.108279e8hbNov 18, 2017 7:41:56 AMlink

XHTML component with both client and server command handlers

8guest179.184.16.883ejsjnqNov 17, 2017 7:16:25 PMlink

A sample for mouse over/out of a div

10guest109.91.33.1542aisu6tNov 17, 2017 3:54:39 PMlink

listbox styles

148guest186.233.152.2503t1dfguNov 17, 2017 11:00:54 AMlink

ZK Router Demo

30guest114.134.185.201tst4v5Nov 13, 2017 1:51:07 PMlink

resources

index.zulzul<window id="layoutWindow" border="none" apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('pkg$.LayoutVM')" height="100%" onBookmarkChange="@command('onHashChange', url = event.bookmark)" onEmptyRoute="@command('goToDefaultRoute')"> <!-- <script type="text/javascript" src="route-init.js" defer="true" /> --> <hlayout> <button label="Root" onClick='pkg$.ZkRouter.getCurrent().goTo("/")' /> <button label="Foo" onClick='pkg$.ZkRouter.getCurrent().goTo("/foo")' /> <button label="Bar" onClick='pkg$.ZkRouter.getCurrent().goTo("/foo/13")' /> </hlayout> <div id="contentHolder" style="overflow: auto;" vflex="true"> <!-- CONTENT GOES HERE --> </div> </window>route-init.jsjavascriptvar hash = window.location.hash; if(hash === null || hash === "") { zAu.send(new zk.Event(zk.Widget.$("$layoutWindow"), "onEmptyRoute", {'' : {'data' : {'nodeId': ''}}}, {toServer:true})); }LayoutVM.javajavaimport org.zkoss.zk.ui.*; import org.zkoss.zk.ui.event.*; import org.zkoss.zk.ui.util.*; import org.zkoss.zk.au.*; import org.zkoss.zk.au.out.*; import org.zkoss.zul.*; import org.zkoss.bind.annotation.*; public class LayoutVM { private ZkRouterFactory routerFactory; private ZkRouter router; @Init public void init() { routerFactory = new ZkRouterFactory(); routerFactory.addRoute("/", "root.zul"); routerFactory.addRoute("/foo", "foo.zul"); routerFactory.addRoute("/foo/{bar}", "bar.zul"); } @AfterCompose public void afterCompose(@ContextParam(ContextType.VIEW) Component view) { Component contentHolder = view.getFellow("contentHolder"); router = routerFactory.createRouter(contentHolder); Clients.showBusy(contentHolder, "Loading..."); } @Command public void goToDefaultRoute() { router.goTo("/"); } @Command public void onHashChange(@BindingParam("url") String url) { Clients.clearBusy(router.getContentHolder()); router.dispatch(url); } } root.zulzul<window border="normal" title="Root.zul"> This is the root.zul! </window> foo.zulzul <window border="normal" title="Foo.zul"> This is foo.zul! </window>bar.zulzul<window border="normal" title="Bar.zul" apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('pkg$.BarVM')"> <label value="The bar parameter is ${vm.bar}" /> </window> BarVM.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.*; import org.zkoss.bind.annotation.*; public class BarVM { private String bar; @Init public void init(@ExecutionArgParam("bar") String bar) { this.bar = bar; } public String getBar() { return bar; } } ZkRouterFactory.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.*; import java.util.*; public class ZkRouterFactory { private Map<String, ZkRoute> routesWithoutParams = new TreeMap<String, ZkRoute>(); private Map<String, ZkRoute> routesWithParams = new TreeMap<String, ZkRoute>(); public ZkRoute addRoute(String url, String view) { url = url.toLowerCase(); url = removeFirstAndLastSlash(url); pkg$.ZkRoute route = new ZkRoute(url, view); if (url.contains("{")) { routesWithParams.put(url, route); } else { routesWithoutParams.put(url, route); } return route; } private String removeFirstAndLastSlash(String url) { url = url.replaceAll("^/", ""); url = url.replaceAll("/$", ""); return url; } public ZkRouter createRouter(Component contentHolder) { ZkRouter router = new ZkRouter(routesWithoutParams, routesWithParams); router.setContentHolder(contentHolder); Executions.getCurrent().getDesktop().setAttribute("router", router); return router; } } ZkRouter.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.*; import java.util.*; public class ZkRouter { private Map<String, ZkRoute> routesWithoutParams = new TreeMap<String, ZkRoute>(); private Map<String, ZkRoute> routesWithParams = new TreeMap<String, ZkRoute>(); private Component contentHolder = null; private Component content = null; public ZkRouter(Map<String, ZkRoute> routesWithoutParams, Map<String, ZkRoute> routesWithParams) { this.routesWithoutParams = routesWithoutParams; this.routesWithParams = routesWithParams; } private String removeFirstAndLastSlash(String url) { url = url.replaceAll("^/", ""); url = url.replaceAll("/$", ""); return url; } public void setContentHolder(Component contentHolder) { this.contentHolder = contentHolder; } public Component getContentHolder() { return contentHolder; } public void dispatch(String url) { url = removeFirstAndLastSlash(url); ZkRoute route = findRoute(url); if (route == null) { return; } else { Map<String, Object> pathVariables = new HashMap<String, Object>(); try { pathVariables = route.resolvePathVariables(url); } catch (RuntimeException e) { return; } if (content != null) { content.detach(); content = null; } content = Executions.createComponents(route.getView(), contentHolder, pathVariables); } } private ZkRoute findRoute(String url) { for (String testUrl : routesWithoutParams.keySet()) { ZkRoute route = routesWithoutParams.get(testUrl); if (route.matches(url)) { return route; } } for (String testUrl : routesWithParams.keySet()) { ZkRoute route = routesWithParams.get(testUrl); if (route.matches(url)) { return route; } } return null; } public void goTo(String url) { url = url.replaceAll("", ""); Clients.evalJavaScript("window.location.hash = '" + url + "';"); } public static ZkRouter getCurrent() { Execution execution = Executions.getCurrent(); if(execution != null && execution.getDesktop() != null) { Object router = execution.getDesktop().getAttribute("router"); if(router != null && router instanceof ZkRouter) { return (ZkRouter) router; } } return null; } } ZkRoute.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.*; import java.util.*; import java.util.regex.*; public class ZkRoute { private String url; private String view; private Pattern urlPattern; private Map<Integer, String> pathVariables = new HashMap<Integer, String>(); public ZkRoute(String url, String view) { this.url = url; this.view = view; resolveUrlPattern(url); } private void resolveUrlPattern(String url) { String urlRegexp = url.replaceAll("\\{[a-zA-Z0-9:]+?\\}", "([^/\\]+)"); urlPattern = Pattern.compile(urlRegexp); String varPatternRegexp = url.replaceAll("\\{[a-zA-Z0-9:]+?\\}", "\\\\{([a-zA-Z0-9:]+)\\\\}"); Pattern varPattern = Pattern.compile(varPatternRegexp); Matcher varMatcher = varPattern.matcher(url); if (varMatcher.matches() && varMatcher.groupCount() >= 1) { for (int i = 1; i <= varMatcher.groupCount(); i++) { String varGroup = varMatcher.group(i); registerVariable(varGroup, i); } } } private void registerVariable(String varGroup, int groupNumber) { String[] parts = varGroup.split(":"); if(parts.length > 2) { throw new IllegalArgumentException("Cannot parse variable " + varGroup + ". Expected input is 'varName[:varType]'!"); } String varName = parts[0].trim(); pathVariables.put(groupNumber, varName); } public String getUrl() { return url; } public String getView() { return view; } public boolean matches(String url) { if (urlPattern.matcher(url).matches()) { return true; } return false; } public Map<String, Object> resolvePathVariables(String url) { Map<String, Object> pathVariables = new HashMap<String, Object>(); Matcher matcher = urlPattern.matcher(url); if (matcher.matches() && matcher.groupCount() >= 1) { for (int i = 1; i <= matcher.groupCount(); i++) { String varGroup = matcher.group(i); String pathVariable = this.pathVariables.get(i); Object value = varGroup; pathVariables.put(pathVariable, value); } } return pathVariables; } }