Using Spreadsheet in JSP"

From Documentation
 
(7 intermediate revisions by 2 users not shown)
Line 3: Line 3:
  
  
__TOC__
 
  
 
{{ZSS EE}}
 
{{ZSS EE}}
  
= Download ZSS JSP Example Project =
+
ZK Spreadsheet can also be embedded in a JSP by spreadsheet custom tag to empower JSP with AJAX. Spreadsheet JSP tag works much the same way as ZK Spreadsheet ZUL component tag does within a ZK application with support for all the attributes and events. You can just download the example project to experience it. Furthermore, if you want a DOM element can interact with Spreadsheet, you can send your own AJAX request in Javascript or use [http://jquery.com JQuery]. Then handle AJAX request by yourself with Spreadsheet API we mentioned in [[ZK_Spreadsheet_Essentials_3/Working_with_Spreadsheet| Working with Spreadsheet]]. We will demonstrate the usage with an example application.
If you want to run ZK spreadsheet JSP demo in your local site, just [http:// download the example project WAR file] and deploy to your application server.  
 
  
= Create and Run a JSP Project =
 
  
Follow instructions in [[ZK Spreadsheet Essentials 3/Working with Spreadsheet/Setting Up Environment]] to create a "dynamic web project" or a "maven project" named '''myzssjsp''' then do the following extra steps for using in JSP.
 
  
== Extra Steps for Eclipse Dynamic Web Project ==
 
This feature is only available in EE, so you should download EE version. (Free Evaluation Download or Premium Download). After you install ZK Spreadsheet library, make sure '''zssjsp.jar''' existed under  <tt>/WEB-INF/lib</tt>.
 
  
== Extra Steps for Maven Project ==
 
In addition to <tt>org.zkoss.zss:zssex</tt> and <tt>org.zkoss.zk:zkmax</tt>, you should add the dependency (<tt>zssjsp</tt>) below:
 
<source lang='xml'>
 
<dependency>
 
    <groupId>org.zkoss.zss</groupId>
 
    <artifactId>zssjsp</artifactId>
 
    <version>${zss.version}</version>
 
</dependency>
 
</source>
 
  
 
+
{{ZKSpreadsheetEssentials3HeadingToc}}
== Verify Your Project ==
+
{{ZKSpreadsheetEssentialsPageFooter}}
After completing above steps, preparation for working with Spreadsheet and JSP is done. You can use a simple page to verify your preparation. Steps are as follows:
 
# Create a simple Excel file or use the sample file in our example project. Put the file under your web application's root folder.
 
# Create <tt>index.jsp</tt> with content below:
 
<source lang='xml' high='11,14'>
 
<%@ 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>
 
<zssjsp:head/>
 
</head>
 
<body>
 
<%@ taglib prefix="zssjsp" uri="http://www.zkoss.org/jsp/zss"%>
 
<div width="100%" style="height: 100%;">
 
<zssjsp:spreadsheet
 
id="myzss" src="/WEB-INF/hellozss.xlsx" width="100%"
 
height="800px" maxrows="200" maxcolumns="40" showSheetbar="true"/>
 
</div>
 
</body>
 
</html>
 
</source>
 
* Line 11: Declare a taglib before using Spreadsheet JSP tag is necessary.
 
* Line 13: Use spreadsheet JSP tag with prefix you specified previously.
 
 
 
Now, deploy the project to your application server and visit <tt>index.jsp</tt> to see if you can see the Spreadsheet.
 
 
 
= Interact with Spreadsheet in JSP =
 
 
 
* must know JQuery
 
*
 
 
 
= example =
 

Latest revision as of 06:53, 22 August 2013


Using Spreadsheet in JSP





Available in ZK Spreadsheet EE only

ZK Spreadsheet can also be embedded in a JSP by spreadsheet custom tag to empower JSP with AJAX. Spreadsheet JSP tag works much the same way as ZK Spreadsheet ZUL component tag does within a ZK application with support for all the attributes and events. You can just download the example project to experience it. Furthermore, if you want a DOM element can interact with Spreadsheet, you can send your own AJAX request in Javascript or use JQuery. Then handle AJAX request by yourself with Spreadsheet API we mentioned in Working with Spreadsheet. We will demonstrate the usage with an example application.





All source code listed in this book is at Github.


Last Update : 2013/08/22

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