废话不多说,现在就开始!
第一步、准备工作
使用ecside工具,你需要准备的有:
1、ecside.jar 和 ecside_final.jar包
2、 ecside.tld标签
3、ecside.js
4、ecside.css
5、ecside使用table图片
第二步、配置web.xml
若要是ecside正常运行,需要在web.xml配置下面内容:
1、初始化ecside.properties文件
<context-param>
<param-name>ecsidePreferencesLocation</param-name>
<param-value>/WEB-INF/classes/ecside.properties</param-value>
</context-param>
2、配置ecside语言编码过滤器。忘记配置它,你的ecside将会出现“正在提交”问题
<filter>
<filter-name>ecsideExport</filter-name>
<filter-class>org.ecside.filter.ECSideFilter</filter-class>
<init-param>
<param-name>useEncoding</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>ecsideExport</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
3、第三步:写ecside.properties
写这个文件的目的是:把公共的内容集中在一个文件中,方便使用。一旦我们使用ecside 组件,哪个这些配置信息就可以直接引用。
形式如下:
##############################################
########### table ###############
##############################################
table.method=post
table.width=95%
table.pageSizeList=10,20,50,100,1000,2000,all
table.rowsDisplayed=10
table.sortable=true
##############################################
########### table ###############
##############################################
column.format.date=yyyy/MM/dd
column.format.number=0.##
column.format.currency=###,###,###
第四步、在action中获得你要列出的内容
形式如下:
List list=this.getColumnManageService().getAllColumnInfo();//获得所有栏目集合
request.setAttribute("select", list); //set集合,注意属性select
return mapping.findForward("select"); //跳到你要输出集合的页面
注:ecside与ORM工具无关,不管你使用什么方法只要能获得一个集合就好。这里我用的是spring与hibernate,获得的集合,你可以用你的方式获得集合,不懂可以忽略它。
第五步、写你的jsp
形式如下:
<%@ page language="java" pageEncoding="utf-8"%>
<%@ taglib uri="/WEB-INF/tld/ecside.tld" prefix="ec" %> //标签ecside.tld
<%String webapp=request.getContextPath(); %>
<html>
<head>
<title>select.jsp</title>
<link rel="stylesheet" type="text/css" href="<%=webapp%>/common/css/ecside_style.css" />
<script language="JavaScript" src="<%=webapp%>/common/js/prototype_mini.js" ></script>
<script language="JavaScript" src="<%=webapp%>/common/js/ecside.js" ></script> //ecside.js
</head>
<body>
<ec:table
items="select" //items的值一定要和request.setAttribute("select", list); 属性一致
var="bo" //通过可以引用属性名,如:bo.columnId
retrieveRowsCallback="process"
action="./switch.do?prefix=/B2B&page=/loginB2B.do&operate=select"
title="用户列表"
width="95%"
listWidth="100%"
resizeColWidth="true">
<ec:row>
<ec:column property="_0" title="序号" style="text-align:center">${GLOBALROWCOUNT}</ec:column>
<ec:column property="columnId" title="ID"/> //它的名字一定是映射文件中的某个属性
<ec:column property="columnName" title="名字" sortable="true"/>
</ec:row>
</ec:table>
</body>
</html>
OK,有很多地方没有细讲,你要努力呀!