There are two types of event handling. One is ZK callbacks, such as the init and cleanup callback mentioned in the previous section. The other is the browser event listeners.
Like the browser event listeners, ZK callbacks are used to handle a situation, such as when the parent's is resized, or when a view becomes visible. Unlike the browser event listeners, they are called by ZK Client Engine directly and registered by use of name convention. In other words, once you declare the method, it will be called automatically.
Tip: ZK scans any callback to register after invoking the init callback, so you can declare them in the init callback.
zkType.init = function (cmp) {zkType.onSize = function (cmp) {};};
zkType.init = function (cmp) {
};
Called when a component is attached to a page or redrawn (due to being invalidated).
The order of invocations is the child first (like Java constructor). The child without a parent is called first, then its child, then its grandchild, and so on.
zkType.cleanup = function (cmp) {
};
Called when a component is detached, or will be redrawn (due to being invalidated).
When the invalidate method is called at the server, ZK Client Engine will first call the cleanup callback, replace the DOM tree, and then call the init callback.
The order of invocations is the parent first. The topmost parent being cleanup is called first, then its child, then its grandchild, and so on.
zkType.beforeSize = function (cmp) {
};
zkType.onSize = function (cmp) {
};
When the browser window or a resizable parent (such as Borderlayout) is resized, ZK Client Engine first call the beforeSize callback for all components that are affected, and then call the onSize callback for them. In other words, it is a two-pass mechanism. The beforSize callback is used to do some preparation. For example, you might have to reset style.width in the beforeSize callback and then set the correct size in the onSize callback.
The order of invocations is the parent first. The topmost parent that is affected is called first, then its child, then its grandchild, and so on.
Notes
The beforeSize and onSize callbacks are also called when initializing a component, so you don't and shalln't handle the size in the init callback.
The browser doesn't notify JavaScript codes when a DOM element is resized, so these two callbacks are actually triggered by the invocation of the zk.beforeSizeAt and zk.onSizeAt methods (by a layout component).
zkType.onVisi = function (cmp) {
};
Called right after a component has become visible.
The order of invocations is the parent first. The topmost parent becoming visible is called first, then its child, then its grandchild, and so on.
Note
The browser doesn't notify JavaScript codes when a DOM element becomes visible or invisible, so it won't be called if you set display="none" directly. On the hand, it is called automatically by ZK Client Engine if the visiblity is changed due to the visible property is changed at the server, or due to the invocation of zk.show or action.show at the client.
zkType.onHide = function (cmp) {
};
Called right before a component becomes invisible. Notice that when this method is called, the component is still visible.
The order of invocations is the parent first. The topmost parent becoming invisible is called first, then its child, then its grandchild, and so on.
zkType.onScroll = function (cmp) {
};
Called when the user is scrolling the browser window or one of its ancestor component.
The order of invocations is the parent first. The topmost parent affected by scrolling is called first, then its child, then its grandchild, and so on.
Notes
The browser doesn't notify JavaScript codes when the user is scrolling a DOM element (rather than the browser window). It is up to a component view decide whether to invoke zk.onScrollAt.
You can listen to whatever browser events you care like any other JavaScript codes. However, ZK provide two methods to simplify the job: zk.listen and zk.unlisten. They are not only compatible with all kind of browsers, but also unlisten automatically – so no worry of memory leak. In fact, you rarely need to invoke zk.unlisten.
zk.listen(cmp, "click", function () {zkCkbox.onclick(cmp);});