When using the ZK framework out-of-the-box, there is not much need to rely on any other communication methods than using the regular controller methods, except you want to pass client-side data that you can’t catch otherwise, eg. from javascripts. Here the most simple sample to talk from a zul page to a controller and passing data. You find the relevant ZK info/reference here, but I still miss a short and crisp sample.
Requirements:
- Any Netbeans IDE beyond version 6.0 (with Glassfish or Tomcat installed)
- ZK plugin to create ZK web app
Tutorial:
- Create WebApp ‘ZKzausend’
Image may be NSFW.
Clik here to view.
Create ZK Web Application
Image may be NSFW.
Clik here to view.Create ZK Web Application
- Modify the default index.zul
Add a id, a controller reference and simple javascript<?xml version="1.0" encoding="UTF-8"?> <zk xmlns="http://www.zkoss.org/2005/zul"> <window id="info" apply="controller.IndexController"> <html><![CDATA[ <script type="text/javascript"> function sendToServer(){ payload = screen.width+'x'+screen.height; zAu.send(new zk.Event(zk.Widget.$(this), 'onUser', payload)); } </script> <a href="#" onClick="sendToServer();">Click Me !</a> ]]> </html> <button id="btnExec" label="Some regular button" /> </window> </zk>Note: Yes, you can retrieve the screen resolution in the controller too using evt.getScreenWidth(). This serves as a sample for your more sophisticated JQuery scripts.
- Create the controller
Image may be NSFW.
Clik here to view.Controller Class
package controller; import org.zkoss.zk.ui.Component; import org.zkoss.zk.ui.event.Event; import org.zkoss.zk.ui.event.ForwardEvent; import org.zkoss.zk.ui.util.GenericForwardComposer; public class IndexController extends GenericForwardComposer { @Override public void doAfterCompose(Component comp) throws Exception { super.doAfterCompose(comp); } public void onUser$info(Event event) { ForwardEvent eventx = (ForwardEvent) event; System.out.println("Client Screen Size:" + eventx.getOrigin().getData()); } }Notes:
- You need to cast the event to ForwardEvent, otherwise event.getData() returns Null !
- Make sure the zul page window id (“info”) and the zau.send parameter (“onUser”) are matching public void onUser$info(Event event)
- Deploy and Run the sample
Image may be NSFW.
Clik here to view.Running Web Application
Check the Glassfish logfile
Image may be NSFW.
Clik here to view.
Image may be NSFW.Clik here to view.
