Create and Run Your First ZK Spreadsheet JSP Application

From Documentation
DocumentationZK Spreadsheet Quick Start GuideQuick StartCreate and Run Your First ZK Spreadsheet JSP Application
Create and Run Your First ZK Spreadsheet JSP Application



Available in ZK Spreadsheet EE only

Create Web Application

Web applications use a standard directory structure defined in the Servlet specification.

When developing web applications, you must follow this structure so that application can be deployed in any J2EE compliant web server.

All you need to do is create a web application directory with related files. J2EEWebApplication.jpg


  • Create one for example named myZSSJSP[1]
  1. ↑ You can download sample application myZSSJSP.war described in this document from here

Install ZK Library Distribution

  1. Download ZK libraries archive from ZK Download and save it on your computer.
  2. Unzip zk-bin-6.5.1.1.zip into a folder of your choice.
  3. Copy JAR files under the following list to myZSSJSP/WEB-INF/lib
    • {YOUR_ZK_UNZIP_FOLDER}/dist/lib
    • {YOUR_ZK_UNZIP_FOLDER}/dist/lib/ext
    • {YOUR_ZK_UNZIP_FOLDER}/dist/lib/zkforge

Install ZK Spreadsheet Library Distribution

  1. Download the ZK Spreadsheet libraries archive "zssee-bin-eval-2.5.0.zip" (ZK Spreadsheet EE Binary) from ZK Spreadsheet Download page and save it on your computer.
  2. Unzip zssee-bin-eval-2.5.0.zip into a folder of your choice
  3. Copy JAR files under the following list to myZSS/WEB-INF/lib
    • {YOUR_ZK_SPREADSHEET_UNZIP_FOLDER}/dist/lib
    • {YOUR_ZK_SPREADSHEET_UNZIP_FOLDER}/dist/lib/ext

Create Deployment Descriptor(Web.xml)

web.xml is called the web application deployment descriptor. This is a XML file that defines servlets, servlet mappings, listeners, filters, welcome files etc.

Deployment descriptor is a heart of any J2EE web application, so every web application must have a web.xml deployment descriptor directly under WEB-INF folder. To use ZK Spreadsheet in your JSP application all you need is to declare ZK's asynchronous update engine servlet and its servlet mapping. Either create an empty web.xml and copy following contents into it or copy the auEngine servlet/servlet-mapping fragment into your existing web.xml file. 

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xmlns="http://java.sun.com/xml/ns/javaee" 
xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" 
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" 
id="WebApp_ID" version="2.5">
  <display-name>myzssjsp</display-name>
	<servlet>
		<description>The asynchronous update engine for ZK</description>
		<servlet-name>auEngine</servlet-name>
		<servlet-class>org.zkoss.zk.au.http.DHtmlUpdateServlet</servlet-class>
	</servlet>
	<servlet-mapping>
		<servlet-name>auEngine</servlet-name>
		<url-pattern>/zkau/*</url-pattern>
	</servlet-mapping>
	
	<servlet>
		<description>ZK loader for ZUML pages</description> 
		<servlet-name>zkLoader</servlet-name> 
		<servlet-class>org.zkoss.zk.ui.http.DHtmlLayoutServlet</servlet-class>
		<init-param> 
			<param-name>update-uri</param-name> 
			<param-value>/zkau</param-value> 
		</init-param> 
		<load-on-startup>1</load-on-startup> 
	</servlet> 
</web-app>

Create a sample MS Excel file

  1. Open MS Excel
  2. Create a new Excel spreadsheet
  3. Enter "Hello from ZK Spreadsheet" in the first or any empty cell
  4. Save this file as "HelloZSS.xlsx" into myZSSJSP/WEB-INF location

Create JSP file

Create a simple JSP file named helloZSS.jsp under the "myZSSJSP" folder and enter the following content in it. 

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>My First ZK Spreadsheet JSP application</title>
</head>
<body>
<%@ taglib prefix="zss" uri="http://www.zkoss.org/jsp/zss"%>
<div width="100%" style="height: 100%;"><zss:spreadsheet
	id="myzss" src="/WEB-INF/HelloZSS.xlsx" width="100%"
	height="800px" maxrows="200" maxcolumns="40" showSheetbar="true"/>
</div>
</body>
</html>

Pack your project

  1. Compress the myZSSJSP directory(e.g. myZSSJSP.zip)
  2. Rename myZSSJSP.zip to myZSSJSP.war
  3. Done!!

Confirm your ZK Spreadsheet JSP application Web Archive (WAR) file

 myZSSJSP.war
 ¦  helloZSS.jsp
 - WEB-INF
     ¦  web.xml
     ¦  HelloZSS.xlsx
     - lib
          *.jar

Deploy and run your first ZK Spreadsheet JSP application

  1. Copy myZSSJSP.war to web server web applications folder. For Tomcat it would be TOMCAT_HOME/webapps folder
  2. Open Browser and visit http://localhost:8080/myZSSJSP/helloZSS.jsp


Download

myZSSJSP.war

Version History

Last Update : 2013/01/08


Version Date Content
     



Last Update : 2013/01/08

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


Retrieved from "https://www.zkoss.org/_w/index.php?title=ZK_Spreadsheet_Quick_Start_Guide/Quick_Start/Create_and_Run_Your_First_ZK_Spreadsheet_JSP_Application&oldid=31685"