As being a ZUML page, it could embed any Java codes and execute them in the server as follows.
<html xmlns:zk="http://www.zkoss.org/2005/zk">
<head>
<title>ZHTML Demo</title>
</head>
<body>
<h1>ZHTML Demo</h1>
<ul id="ul">
<li>The first item.</li>
<li>The second item.</li>
</ul>
<input type="button" value="Add Item" zk:onClick="addItem()"/>
<br/>
<input id="inp0" type="text" zk:onChange="add()"/> +
<input id="inp1" type="text" zk:onChange="add()"/> =
<text id="out"/>
<zscript>
void addItem() {
Component li = new Raw("li");
li.setParent(ul);
new Text("Item "+ul.getChildren().size()).setParent(li);
}
void add(){
out.setValue(inp0.getValue() + inp1.getValue());
}
</zscript>
</body> </html>
In the above example, we use the ZK namespace to specify the onClick property. It is necessary because XHTML itself has a property with the same name.
It is interesting to note that all Java codes are running at the server. Thus, unlike JavaScript you are used to embed in HTML pages, you could access any resource at the server directly. For example, you could open a connection to a database and retrieve the data to fill in certain components.
<zscript>
import java.sql.*;
void addItem() {
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
String url = "jdbc:odbc:Fred";
Connection conn = DriverManager.getConnection(url,"myLogin", "myPassword");
...
conn.close();
}
</zscript>