Adams Bros Blog

30Jan/101

ZK AJAX Framework Introduction

I am in the process of working with and researching ZK as an AJAX framework to integrate into Java Web Development that I do.  So far, AJAX looks really amazing, and is fully integrated into the J2EE framework.  It is an event driven framework that has the option of hooking directly into existing JSP, or entirely writing ZK event handlers to do the processing.  There is no wonder that ZK won the Project of the Month Source Forge award.

Integration

In the case of existing web applications that make heavy use of JSP for display, ZK can be easily integrated into specific controls on the page, such as drop downs, text boxes, etc, to provide AJAX for that individual component.  The component is then submitted using the normal GET/POST method.  You can thereby provide AJAX auto complete, or dynamic load functionality to your heart's content, without affecting the normal working of the page.  If your goal is to move toward entirely using AJAX for that application, you can easily do it incrementally, so as not to have an overly complex and long development cycle.  Just drop some of the ZUL includes directly into your JSP, write some ZSCRIPT or Java component/event classes, handle the processing, and you have yourself some event driven AJAX code.

GUI Features

ZUL files are essentially a derivative of XUL, defined for the purpose of AJAX handling in ZK.  You define your GUI layout in XML, and write code to handle each component as you choose.

One of many great benefits of ZK, is that it has many different ZUL components for the normal input text box.  You can make your text box a decimal box, a date box, int box, double box, etc, and AJAX will handle data validation for you, and wrapping it in the appropriate wrapper class such as BigDecimal, Integer, Double, etc.  In fact, in many cases, it won't even let you type in a character that is not allowed.  For example, if you have specified a number box of some type, such as decimal, int, double, etc, it won't even let you type an alpha character.  You can also place constraints on your inputs such as "no zero", or "no negative", which would indicate that the box cannot accept a negative or zero input, but could be empty.

Here is a quick example of a decimalbox in action. I'll give two examples. The first one has an implementing Java class, which you simply write a class that extends Decimalbox. The implementing class is just below that on the page. The second one achieves the exact same thing, but is not quite as flexible, for the simple reason that it's not as dynamic, because I you cannot go instantiating it from code.

<decimalbox use="com.example.common.LedgerDecimalBox" id="credit-0"/>
<decimalbox constraint="no negative,no zero" format="#,##0.#" scale="2"/>
package com.example.common;
 
import com.example.util.CVUtil;
import org.apache.log4j.Logger;
import org.zkoss.zk.ui.ext.AfterCompose;
import org.zkoss.zul.Decimalbox;
 
public class LedgerDecimalBox extends Decimalbox implements AfterCompose
{
    private static Logger logger = Logger.getLogger(LedgerDecimalBox.class);
    public LedgerDecimalBox()
    {   // load configured options
        setFormat(Util.getStringItem("/inputs/decimalbox/format"));
        setConstraint(Util.getStringItem("/inputs/decimalbox/constraints"));
        setScale(2);
    }
 
    public void afterCompose()
    {
        logger.info("id: " + getId());
    }
}

In all honesty, ZK seems to be absolutely amazing, very rich, very fast, very flexible, etc.  In my opinion, it is probably THE BEST AJAX framework on the planet, by a LONG shot.

You can totally expect me to write more on ZK, as I learn the framework, and blog about various ways of doing things.

Comments (1) Trackbacks (0)
  1. Nice article. However, to be frank, I always can’t appreciate the fancy of such framework. Instead of ZK’s new language, why not we ourselves pick up javascript, jquery ourselves. Why not we have our own say, instead of letting ZK control. Plus there is a performance impact using its translation mechanism.


Leave a comment

 

No trackbacks yet.