Create and Run Your First ZK Spreadsheet JSP Application"

From Documentation
 
(17 intermediate revisions by 4 users not shown)
Line 10: Line 10:
  
  
−
*Create one for example named <span style="color:green">'''myZSSJSP'''</span><ref>You can download sample application myZSSJSP.war described in this document from [http://zkbooks.googlecode.com/files/myZSSJSP.war here]</ref>
+
*Create one for example named <span style="color:green">'''myZSSJSP'''</span><ref>You can download sample application myZSSJSP.war described in this document from [http://sourceforge.net/projects/zkforge/files/Small%20Talks/Create%20and%20Run%20Your%20First%20ZK%20Spreadsheet%20JSP%20Application/myZSSJSP.war/download here]</ref>
 
<blockquote>
 
<blockquote>
 
----
 
----
Line 18: Line 18:
 
===Install ZK Library Distribution===
 
===Install ZK Library Distribution===
 
#Download ZK libraries archive from [http://www.zkoss.org/download/zk.dsp ZK Download] and save it on your computer.
 
#Download ZK libraries archive from [http://www.zkoss.org/download/zk.dsp ZK Download] and save it on your computer.
−
#Unzip zk-bin-5.0.5.zip into a folder of your choice.
+
#Unzip zk-bin-6.5.1.1.zip into a folder of your choice.
−
#Copy JAR files under following list to <u>'''myZSSJSP'''/WEB-INF/lib</u>
+
#Copy JAR files under the following list to <u>'''myZSSJSP'''/WEB-INF/lib</u>
 
#:* {YOUR_ZK_UNZIP_FOLDER}/dist/lib   
 
#:* {YOUR_ZK_UNZIP_FOLDER}/dist/lib   
 
#:* {YOUR_ZK_UNZIP_FOLDER}/dist/lib/ext
 
#:* {YOUR_ZK_UNZIP_FOLDER}/dist/lib/ext
Line 25: Line 25:
  
 
===Install ZK Spreadsheet Library Distribution===
 
===Install ZK Spreadsheet Library Distribution===
−
#Download ZK Spreadsheet libraries archive "zk-spreadsheet-bin-2.0.0.zip" from [http://www.zkoss.org/download/zkspreadsheet.dsp ZK Spreadsheet Download page] and save it on your computer.
+
#Download the ZK Spreadsheet libraries archive "zssee-bin-eval-2.5.0.zip" (ZK Spreadsheet EE Binary) from [http://www.zkoss.org/download/zkspreadsheet.dsp ZK Spreadsheet Download page] and save it on your computer.
−
#Unzip zk-spreadsheet-bin-2.0.0.zip into a folder of your choice
+
#Unzip zssee-bin-eval-2.5.0.zip into a folder of your choice
−
#Copy JAR files under following list to <u>'''myZSS'''/WEB-INF/lib</u>
+
#Copy JAR files under the following list to <u>'''myZSS'''/WEB-INF/lib</u>
 
#:* {YOUR_ZK_SPREADSHEET_UNZIP_FOLDER}/dist/lib   
 
#:* {YOUR_ZK_SPREADSHEET_UNZIP_FOLDER}/dist/lib   
 
#:* {YOUR_ZK_SPREADSHEET_UNZIP_FOLDER}/dist/lib/ext
 
#:* {YOUR_ZK_SPREADSHEET_UNZIP_FOLDER}/dist/lib/ext
Line 35: Line 35:
  
 
Deployment descriptor is a heart of any J2EE web application, so ''every web application '''must have''' a web.xml deployment descriptor directly under <u>WEB-INF</u> folder''.
 
Deployment descriptor is a heart of any J2EE web application, so ''every web application '''must have''' a web.xml deployment descriptor directly under <u>WEB-INF</u> 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
+
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.
  
 
<source lang="xml">
 
<source lang="xml">
Line 55: Line 55:
 
<url-pattern>/zkau/*</url-pattern>
 
<url-pattern>/zkau/*</url-pattern>
 
</servlet-mapping>
 
</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>
 
</web-app>
 
</source>
 
</source>
  
−
*For more information on the content of <u>web.xml</u>, please refer to [http://books.zkoss.org/wiki/ZK_Installation_Guide/ZK_Background/Sample_of_web.xml Sample of web.xml] and  [http://books.zkoss.org/wiki/ZK_Installation_Guide/ZK_Background/Sample_of_web.xml_for_Servlet_2.3 Sample of web.xml for Servlet 2.3] ''(For some web container which support Servlet 2.3 only (e.g. Tomcat 4.x)''. This is for your reference only.
+
*For more information on the content of <u>web.xml</u>, please refer to [[ZK_Installation_Guide/ZK_Background/Sample_of_web.xml| Sample of web.xml]] and  [[ZK_Installation_Guide/ZK_Background/Sample_of_web.xml_for_Servlet_2.3| Sample of web.xml for Servlet 2.3]] ''(For some web container which support Servlet 2.3 only (e.g. Tomcat 4.x)''. This is for your reference only.
  
 
===Create a sample MS Excel file===
 
===Create a sample MS Excel file===
Line 67: Line 78:
 
   
 
   
 
===Create JSP file===
 
===Create JSP file===
−
Create a simple JSP file named '''helloZSS.jsp''' under "myZSSJSP" folder and enter following contents in it.
+
Create a simple JSP file named '''helloZSS.jsp''' under the "myZSSJSP" folder and enter the following content in it.
 
<source lang="xml">
 
<source lang="xml">
 
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
 
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
Line 81: Line 92:
 
<div width="100%" style="height: 100%;"><zss:spreadsheet
 
<div width="100%" style="height: 100%;"><zss:spreadsheet
 
id="myzss" src="/WEB-INF/HelloZSS.xlsx" width="100%"
 
id="myzss" src="/WEB-INF/HelloZSS.xlsx" width="100%"
−
height="800px" maxrows="200" maxcolumns="40" /></div>
+
height="800px" maxrows="200" maxcolumns="40" showSheetbar="true"/>
 +
</div>
 
</body>
 
</body>
 
</html></source>
 
</html></source>
 +
 +
Note: You should have zssjsp.jar on your classpath for the taglib directive to work
 +
 +
The showSheetbar attribute enables the display of multiple sheets in a work book.
  
 
===Pack your project===
 
===Pack your project===
Line 107: Line 123:
  
 
==Download==
 
==Download==
−
[http://zkbooks.googlecode.com/files/myZSSJSP.war myZSSJSP.war]
+
[http://sourceforge.net/projects/zkforge/files/Small%20Talks/Create%20and%20Run%20Your%20First%20ZK%20Spreadsheet%20JSP%20Application/myZSSJSP.war/download myZSSJSP.war]
  
 
=Version History=
 
=Version History=

Latest revision as of 09:03, 4 February 2013

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>

Note: You should have zssjsp.jar on your classpath for the taglib directive to work

The showSheetbar attribute enables the display of multiple sheets in a work book.

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/02/04


Version Date Content
     



Last Update : 2013/02/04

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=34625"