|
|
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. You can just download the example project to experience it. Furthermore, if you want a DOM element can interact with Spreadsheet, you can use [http://jquery.com JQuery]. 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>
| |
− | | |
− | | |
− | == Verify Your Project ==
| |
− | 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
| |
− | | |
− | * bookProvider
| |
− | * handle events with jquery
| |
− | * JS variable <tt>zssjsp</tt> ?
| |
− | | |
− | = example =
| |