日期:2014-05-16  浏览次数:20570 次

Extreme Table 的使用->JSP页面显示
eXtreme Table 说明
==================

eXtreme Table 是ExtremeCompontents(http://extremecomponents.org)中一个功能强大而又容易配置、扩展、自定义的Table控件,其功能包括分页、排序、过滤、导出Excel、pdf和汇总等。

扩展eXtreme Table:extremetable-ext.jar是我们自己编写的eXtreme Table扩展包,里面的类继承了原eXtreme Table中的类,并根据我们自己的需要进行了修改和扩展。主要扩展内容包括:显示分页页号、CSV导出表头等。

其样子类似这样:





---------
基本配置:
---------

1)首先下载发行包 http://sourceforge.net/projects/extremecomp;
2)将包内的extremecomponents.jar 文件拷贝到项目的 WEB-INF/lib 目录中
5)将 images 文件夹拷贝到 webroot目录中
6)将 extremecomponents.css 拷贝到 webroot/css目录中
7)将eXtreme Table扩展包extremetable-ext.jar拷贝到项目的 WEB-INF/lib 目录中
8)eXtremeTable支持在properties文件里方便的统一配置丰富的全局属性,可以在/source/org/extremecomponents/table/core目录找到extremetable.properties文件,可以把它复制到src/里面并进行修改,也可以在src/里新建一个extremetable.properties文件,在里面只写需要修改的属性,其他属性会自动去jar包中的extremetable.properties文件获取。

还要在web.xml中加上:

<context-param>	
	<param-name>extremecomponentsPreferencesLocation</param-name>
        <param-value>/extremetable.properties</param-value>	
</context-param>	

<filter>			
	<filter-name>eXtremeExport</filter-name>		
	<filter-class>org.extremecomponents.table.filter.ExportFilter</filter-class>		
</filter>			
<filter-mapping>			
	<filter-name>eXtremeExport</filter-name>		
	<url-pattern>/*</url-pattern>		
</filter-mapping>



--------------------------------------------
本项目用到的一些extremetable.properties配置:
--------------------------------------------

table.filterable=false 不允许过滤
table.sortable=false 不允许排序
table.imagePath=/images/table/*.gif 图片路径
table.locale=ja_JP 使用日语

table.view.html=org.extremecomponents.table.view.UserCompactView 使用extremetable-ext中的html视图类
export.view.csv=org.extremecomponents.table.view.UserCsvView 使用extremetable-ext中的CSV视图类

row.highlightRow=true 鼠标经过时高亮显示行

column.format.date=yyyy-MM-dd HH:mm:ss 当列设置为cell="date"时采用的显示格式
column.format.currency=###,###,###,###,#00.00 当列设置为cell="currency"时采用的显示格式

table.pageDisplayed=7 在页号选择中显示7个页号 (如图中1所示位置)
table.rowsDisplayed=20 表格每页显示20行


---------------
基本原理和流程:
---------------

1、首先,从action中按指定的每页n行获取第一页的数据,即获取前n个数据。
2、Action将数据发给JSP页面,由eXtremeTable的<ec:table>标签显示出第一页。
3、JSP中的<ec:table>本质上是一个form,在选择其他页时,eXtremeTable将把上次传入的参数加上要显示的页号等参数作为该form的参数,把该form提交给指定的action。
4、Action将按照传入的上次检索条件和本次的页号等参数重新获取一遍要显示的数据,然后再发给JSP中的<ec:table>。每次只取得一页显示需要的结果集,不获取多余的数据,从而减轻了数据库的负荷。

--------------
使用Limit特性:
--------------

  默认的情况下eXtremeTable取得所有的结果集然后处理Beans集合,这样的好处是你可以随意进行排序、过滤和分页操作。你只需要组装Beans集合并让eXtremeTable知道如何引用它。这样的操作对于小到中等数据量的结果集非常有效,但结果集很大时这将非常糟糕。为了提高性能,正如前面基本原理和流程所描述的,我们希望每次只取得一页显示需要的结果集,不获取多余的数据,即数据库端分页的方案。为此我们使用eXtremeTable的Limit特性。

  Limit这个名字来自MySQL的limit命令,Limit接口的目的就是如何对表的结果集进行limit处理。Limit实现知道当排序、过滤、分页、导出时,用户如何与表互相作用。有了这些信息你将能够使用可能是最有效的方式显示正确的过滤、排序、分页后的请求页面。

  使用Limit时,eXtremeTable会使用Limit对象向Action传递PageNo,PageSize,OrderBy等分页信息。而服务端将向EC返回总记录数和当前页的内容。

---------
基本用法:
---------

下面以一个简单的例子说明最基本的用法:

1) JSP中:

  一个简单的eXtreme Table类似于这个样子:

<ec:table items="operators" var="operator"	
		action="${pageContext.request.contextPath}/sample.do"
		retrieveRowsCallback="limit" sortRowsCallback="limit" filterRowsCallback="limit"
		filterable="false" sortable="false" showExports="true"
		autoIncludeParameters="${empty param.autoInc?true:false}">			
		<ec:exportCsv fileNam