How to set Textbox Maxlength in the view model ?

Phone Box–Using j Query and Extending ZK Textbox

Summary
In this post, we will see how we can use jquery with ZK  for US Phone number format. And also later on, we will see how we can this as a reusable component by extending the ZK Textbox

Thanks to the following ZK Forum and all the contributors who helped me to create this article
http://www.zkoss.org/forum/listComment/17490-How-to-apply-a-mask-in-a-Textbox-not-rendered-by-a-zul-file

Text Box on change and on Changing Event

ZK Demo site shows the example using ZUL File how to handle onChanging event. Let us see how we can handle in java using MVC  GenericForwardComposer composer

Zul File

<?page title="On Change Event" contentType="text/html;charset=UTF-8"?>

<zk>

    <window title="On Change Event" border="normal" apply="mypack.OnchangeTxt">

        <grid width="100%">

            <rows>

                <row>

                    onChanging textbox:

                    <textbox id="t1" />

                </row>

                <row>

                    Instant copy:

                    <textbox id="copy" readonly="true" />

                </row>

            </rows>

        </grid>

    </window>

</zk>

Controller

package mypack;

import org.zkoss.zk.ui.util.GenericForwardComposer;

import org.zkoss.zk.ui.event.Event;

import org.zkoss.zk.ui.event.InputEvent;

import org.zkoss.zul.Textbox;

public class OnchangeTxt extends GenericForwardComposer {

    private Textbox copy;

    public void onChanging$t1(InputEvent event) {

        copy.setValue(event.getValue());

    }

}