Overview"

From Documentation
m (Created page with '{{ZKJSPTagsEssentialsPageHeader}} =Version History= {{LastUpdated}} {| border='1px' | width="100%" ! Version !! Date !! Content |- |   |   |   |} {{ZKJSPTagsEssen…')
 
Line 1: Line 1:
 
{{ZKJSPTagsEssentialsPageHeader}}
 
{{ZKJSPTagsEssentialsPageHeader}}
 +
 +
This section demonstrates how to use ZK JSP tags in your JSP document.
 +
 +
=Prerequisite=
 +
==DOCTYPE==
 +
 +
To use ZK components correctly, the JSP page must specify DOCTYPE as follows.
 +
 +
<source lang="html">
 +
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 +
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 +
 +
<html>
 +
...
 +
</source>
 +
 +
==BODY Style==
 +
 +
By default, ZK will set the CSS style of the BODY tag to <code>width:100%;height:100%</code> If you prefer to have the browser to decide the height (i.e., the browser's default), you could specify <code>height:auto</code> to the BODY tag (optional).
 +
 +
<source lang="xml">
 +
<body style="height:auto">
 +
...
 +
</source>
 +
 +
==Browser Cache==
 +
 +
Though optional, it is suggested to disable the browser to cache the result page. It can be done as follows.
 +
 +
<source lang="xml">
 +
<html xmlns="http://www.w3.org/1999/xhtml">
 +
  <head>
 +
    <meta http-equiv="Pragma" content="no-cache" />
 +
    <meta http-equiv="Expires" content="-1" />
 +
</source>
 +
 +
In additions, you could invoke the following statement in JSP to tell ZK to drop desktops once the user navigates to other URL. It is optional but it saves memory since the browser page is not cached and safe to remove if the user navigates away.
 +
 +
<source lang="xml">
 +
<%
 +
request.setAttribute(org.zkoss.zk.ui.sys.Attributes.NO_CACHE, Boolean.TRUE);
 +
%>
 +
</source>
 +
 +
Notice that it has to be invoked before ZK JSP's zkhead tag, if ZK JSP is used, or before the first <code>jsp:include</code> that includes a ZUL page.
 +
 +
 +
=Taglib Declaration=
 +
Using ZK JSP Tags is the same as to using other JSP tag libraries. You declare a <%@taglib %> to define the prefix and mapping URI of the ZK JSP Tags:
 +
 +
<source lang="html">
 +
<%page uri="http://www.zkoss.org/jsp/zul" prefix="zk" %>
 +
</source>
 +
 +
=Page Tag Declaration=
 +
In ZK world, every ZK component must be contained by a Desktop instance. It will manage the
 +
Ajax connections of each component. In JSP, you have to specify a <page> tag to initialize the
 +
Desktop instance if it's not existed:
 +
 +
<source lang="xml">
 +
<zk:page zscriptlanguage="java" >
 +
 +
...
 +
 +
// The ZK Component Tags declaration Area...
 +
 +
... </zk:page>
 +
// Wrong place to put ZK Component Tags...
 +
</source>
 +
 +
The page tag also creates a Page instance automatically, and this page instance is a container to contain components. In one JSP document, you can declare multiple pages like this:
 +
 +
<source lang="xml">
 +
<zk:page  id="pg1" style="height:100px;width=300px">
 +
// The ZK Components declaration Area...
 +
</zk:page>
 +
//Other JSP Content...
 +
<zk:page  id="pg2" style="height:100px;width=300px">
 +
// The ZK Components declaration Area...
 +
</zk:page
 +
</source>
 +
 +
The rule to access variables across pages is the same as to do so in pure ZK document. For more
 +
detailed information about Page(org.zkoss.zk.ui.Page), please refer to [[ZK_Developer's_Guide | ZK Developer's Guide]].
 +
 +
=Component Tag Declaration=
 +
 +
After declaring page tag, now we can add some component tags into it. For example:
 +
 +
<source lang="xml">
 +
<zk:page>
 +
    <zk:window id="myWin" title="ZK JSP Tags Demo">
 +
        <zk:label value="Hello ZK JSP Tags!!!"/>
 +
    </zk:window>
 +
<h1>mix with other tags.</h1>
 +
</source>
 +
 +
As you can see, the codes look like a ZUML document.
  
 
=Version History=
 
=Version History=

Revision as of 05:10, 26 November 2010


DocumentationZK JSP Tags EssentialsWorking with ZK JSP TagsOverview
Overview



This section demonstrates how to use ZK JSP tags in your JSP document.

Prerequisite

DOCTYPE

To use ZK components correctly, the JSP page must specify DOCTYPE as follows. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
...

BODY Style

By default, ZK will set the CSS style of the BODY tag to width:100%;height:100% If you prefer to have the browser to decide the height (i.e., the browser's default), you could specify height:auto to the BODY tag (optional). 

<body style="height:auto">
...

Browser Cache

Though optional, it is suggested to disable the browser to cache the result page. It can be done as follows. 

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="-1" />

In additions, you could invoke the following statement in JSP to tell ZK to drop desktops once the user navigates to other URL. It is optional but it saves memory since the browser page is not cached and safe to remove if the user navigates away. 

<%
	request.setAttribute(org.zkoss.zk.ui.sys.Attributes.NO_CACHE, Boolean.TRUE);
%>

Notice that it has to be invoked before ZK JSP's zkhead tag, if ZK JSP is used, or before the first jsp:include that includes a ZUL page.


Taglib Declaration

Using ZK JSP Tags is the same as to using other JSP tag libraries. You declare a <%@taglib %> to define the prefix and mapping URI of the ZK JSP Tags: 

<%page uri="http://www.zkoss.org/jsp/zul" prefix="zk" %>

Page Tag Declaration

In ZK world, every ZK component must be contained by a Desktop instance. It will manage the Ajax connections of each component. In JSP, you have to specify a <page> tag to initialize the Desktop instance if it's not existed: 

<zk:page zscriptlanguage="java" >

...

// The ZK Component Tags declaration Area...

... </zk:page>
// Wrong place to put ZK Component Tags...

The page tag also creates a Page instance automatically, and this page instance is a container to contain components. In one JSP document, you can declare multiple pages like this: 

<zk:page  id="pg1" style="height:100px;width=300px">
// The ZK Components declaration Area...
</zk:page>
//Other JSP Content...
<zk:page  id="pg2" style="height:100px;width=300px">
// The ZK Components declaration Area...
</zk:page

The rule to access variables across pages is the same as to do so in pure ZK document. For more detailed information about Page(org.zkoss.zk.ui.Page), please refer to ZK Developer's Guide.

Component Tag Declaration

After declaring page tag, now we can add some component tags into it. For example: 

<zk:page>
    <zk:window id="myWin" title="ZK JSP Tags Demo">
        <zk:label value="Hello ZK JSP Tags!!!"/>
    </zk:window>
<h1>mix with other tags.</h1>

As you can see, the codes look like a ZUML document.

Version History

Last Update : 2010/11/26


Version Date Content
     


Last Update : 2010/11/26

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.


Retrieved from "https://www.zkoss.org/_w/index.php?title=ZK_JSP_Tags_Essentials/Working_with_ZK_JSP_Tags/Overview&oldid=12441"