[2007-01-21 18时发布]ecside 1.0rc1: 列表组件eXtremeComponents全面增强版

ecside介绍：
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

ecside是一个开源的列表组件。
他源自著名开源列表组件 eXtremeComponents （http://www.extremecomponents.org），
但现在已经脱离eXtremeComponents,独立发展（仍有大量代码来自 eXtremeComponents）。
“做最实用易用的列表组件”是ecside最终的目标。

作者： fins ( name: Wei Zijun    email:[e-mail]   blog:http://fins.iteye.com )

在使用前，请阅读一下以下信息，以帮助您了解您要使用的将是一个多么不成熟的东西(但它会有成熟的一天，而且那天不会远 呵呵)：
1 ecside不能和原始版本的 eXtremeComponents 同时使用，且不保证能与原先使用 eXtremeComponents 的系统兼容，请见谅。
2 目前只支持GBK编码的应用，请见谅。
3 目前只在IE6 和FireFox2 上进行过测试，不保证兼容其他(版本)浏览器，请见谅。
4 目前提供的样式风格巨丑无比，请见谅。
5 目前没有完备的文档和例子，请见谅。
6 代码没有注释，没有测试用例，请见谅。
7 没有很好的版本控制，没有构建脚本，请见谅。
8 拥有无数未知的bug，请见谅。

ecside发布地址：
http://fins.iteye.com/blog/40190

ecside发布地址：
http://fins.iteye.com/blog/40190
ecside圈子:
http://ecside.iteye.com/
ecside综合讨论专用帖
http://fins.iteye.com/blog/48723 

其他出色的列表组件(有些是收费的)：
eXtremeComponents原始版 ( http://www.extremecomponents.org )
dhtmlXGrid ( http://scbr.com/docs/products/dhtmlxGrid/ )
displaytag ( http://displaytag.sourceforge.net )
nitobi grid ( http://www.nitobi.com/products/grid/ )
ActiveWidgets gird ( http://www.activewidgets.com/grid/ )
rico livegrid ( http://openrico.org/rico/livegrid.page )

 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
主要增强的功能：
1 可设置工具条位置（上 下 或 不显示）
2 可设置工具条内容（显示哪些 不显示哪些）
3 可设置工具条上各个功能按钮的相对位置
4 增加了调整页大小的选择框，并可自定义选择框内的内容
5 增加了带有邻近页面的导航条
6 增加了可跳转到指定页面的跳转框
7 增加了当前选中行高亮
8 为ec:table 增加了 excludeParameters 和 includeParameters 属性，可以实现更快捷简便的“参数保留/不保留”功能
9 可添加自定义的html代码到工具条内 或其他位置
10 可手动调整列宽
11 增加了“列表内部滚动条”(实现列表头固定，列表体滚动的功能)
12 为ec:row和ec:column 添加更多的html事件支持，现支持：onmouserover onmouserout onclick ondbclick
13 为ec:table ec:row ec:column增加了自定义扩展属性功能
14 增加 ec:extendrow 标签，实现列表扩展行的功能
15 增加shadowRow(影子行)功能：每行下面可以再加一个子行 这个行里显示什么可以由大家自己定义
16 增加页面变量 ${TOTALROWCOUNT} 用来标示当前纪录在全部记录中的行数
17 增加了打印功能（尚不完善）
18 ec:column属性增加 ellipsis ,实现单元格内数据过长的时候 自动截短并加"..."的功能(ie only)
19 实现了跨列的列表头
20 统计栏的标题格可跨列
21 增加了若干种cell 和 headerCell,例如checkbox radio
22 取消了imagePath属性,样式相关的图片信息全部提入css内
23 重（第4声）用了js 和css ，很多功能用js来实现
24 支持了ajax翻页
25 支持预查询功能，在察看第n页的时候，把n+1页的数据也查询出来（隐藏着）备用，加快查看下一页的速度
26 将导出excel所使用的组件由poi切换成了 jxl
27 xls导出方式修改 原始的导出是导出的vo/map里的原始数值 现在是导出页面实际显示的内容
28 增加简捷导出方式 (通过ec:table的 xlsFileName pdfFileName csvFileName属性)
29 支持pdf中文导出。
30 代码进行了大规模的重构
31 增加了很多ajax相关特性
32 实现了可编辑列表功能 以及cell的映射功能
... ...

更新日志：
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
新增加的特性通常都在 demo.do.jsp这个例子里进行演示。

===============================
2007-01-21 15点
===============================
对于以下更新，demo.do.jsp进行了修改，大家看看例子可能会更好理解.

1) 实现了cell的映射功能（详见示例的性别 和 角色列）,用法:
了一个简单的小标签 用来从map生成 select的option列表。
<ec:options tagattributes="附加的html属性" defaultkey="默认选中的option的value" items="MAP在context内的key"></ec:options>

xml 代码

<ec:column mappingItem="用来映射的MAP在context内的key" mappingDefaultValue="当找不到映射值时要使用的默认值".../>

例如，在示例中，角色的信息以 “标识--名称”的形式放到了一个 map内
在action中 把这个map放到了 request.setAttribute("USERROLE_MAP", CommonDictionary.USERROLE);内
在页面使用

xml 代码

<ec:column property="USERROLE" title="角色" mappingItem="USERROLE_MAP" mappingDefaultValue="[错误的角色]"/>

就会自动将名称显示出来。
2) 做

xml 代码

<ec:options items="MAP在context内的key" defaultKey="默认选中的option的value" tagAttributes="附加的html属性"/>

3) 对ec:extend标签做了扩充，增加了位置设置属性 location
top: form内列表主体前  ; bottom : form内列表主体后 
toolbar或不设置location属性  在toolbar的扩展位置.
4) 代码进行了一点点修改，对使用没有影响。

===============================
2007-01-20 9点   ECSIDE 1.0 RC1 发布啦
===============================
沉寂两天，但一直没有闲着，带来了大变化 索性来个 1.0 RC1 版 :) 。
1) 实现了灵活的可定制的“可编辑列表”功能 （详见help.txt 200行左右的描述 以及示例）
支持多种编辑方式（文本框 下拉框 将来还会支持更多），可自定义模版（使用自定义的文本框 下拉框），还提供了：
对可编辑列进行标识，对编辑过的cell进行标识（默认为改变单元格背景色），
使用ajax技术提交后台，提交成功的cell将清除编辑标识 等贴心设计。
2) 增加了 高亮显示选中行的功能，使用 ec:table属性: selectlightRow="true"
3) 去掉了 fullnavigation导航条，将其与navigation导航条合并
改为为ec:table增加属性 nearPageNum="数字" 用来设置导航条前后显示的邻近页数 等于0时 为不使用邻近页。
4) 为ec:table增加了 maxRowsExported="数字" 属性，用来限制导出大最大条数， 如果数据超过这个数目，则不执行导出操作。
5) 为之前增加的ec:table的pageSizeList属性 增加了特性
pageSizeList="max:200,10,15,30,50,100,all" 如果 10--100以及all中，某一项大过了max的200则 不在列表中显示。
也可以只使用pageSizeList="max:200" 此时将 使用默认设置，并进行max控制。
6) 解决了pdf中文编码问题，终于支持pdf导出了。
7) 恢复了对sitemesh的支持，用法见原版ec文档（我没有亲自没有测试,因为我不会用sitemesh :( ）。
8) Ajax翻页优化，同时增加了 ECSide.findAjaxZoneAtClien 属性，可设置 客户端 还是 服务端进行 html代码剪裁。
默认推荐使用 服务器端。
9) 再次对js和java代码进行了较大规模的重构,清理了一些无用代码，添加了必要的协议信息。
10) 一些细节的修改(例如对滚轮的支持更自然,filterable="true"手动调节列宽功能屏蔽等)
还有对一些小bug的修正，但是由于变化较大，肯定还会带来一些新bug。
11) 整个示例的应用逐步发展为 ecside 的最佳实践，加入了hsqldb（hsqldb的使用参考了springside），全新的例子。
当然还不够好 会在以后的日子里继续完善。
12) 做了一个简单的logo :)。

顺便问一下：
我使用了 springside 的 HsqlListener （做了些修改 但绝对不涉及到核心），为什么在每次重启应用的时候总是包下面的异常呢？？
Exception in thread "HSQLDB Timer @15d63da" java.lang.NullPointerException
 at org.hsqldb.lib.HsqlTimer.nextTask(Unknown Source)
 at org.hsqldb.lib.HsqlTimer$TaskRunner.run(Unknown Source)
 at java.lang.Thread.run(Unknown Source)

===============================
2007-01-16 14点
===============================
1) 当使用“列表内部滚动条”时，可以使用百分比来设置列表的宽度了。
(但还是建议您使用像素（px）作为列表和列的宽度单位,因为百分还有一些小bug)
还有个建议 不管是使用什么样的宽度，建议都要使用一个“自动宽度”的column，
就是说不要给所有的ec:column都指定width，给其中一个点“自由”，这样很多已知的关于列宽调整的问题都可以解决。
2) 对eccn.js进行了大量的修改，提供了更好(但不完美)的IE和FF兼容（一致）性（这个工作差点把我累吐血）.
ff和ie 在取得对象坐标和宽度的算法不同 太郁闷了
3) 修正了一些bug。

===============================
2007-01-12 以及之前的一些更新日志
===============================
1) 为“列表内部滚动条”增加了对鼠标滚轮的支持(只在ie6和ff2下测试过,其他版本没有测试)
2) 将部分“列表内部滚动条”相关的代码从java中提出,改用js实现.
3) 对js文件做了一些调整。
4) 修正了一些小bug。

===============================
1) 修正了一个“列表内部滚动条”的bug
该bug表现为在 IE里 有些windows的主题下，纵向滚动条不可用。FT!!!!!
2) eccn.js做了一点小小的改动，为将来做过编码支持打下了一点点基础.

===============================
1) 修正了改变页面大小时“列表内部滚动条”错乱的bug
2) 重构了“列表内部滚动条”相关的js和java代码

===============================
1) 修正了使用ajax翻页时“列表内部滚动条”错乱的bug
2) 增加了当列表内容的实际宽度和高度小于设置的宽度和高度的时候，
   自动调整区域大小,同时自动隐藏滚动条（只隐藏横向的）的功能。

===============================
增加了“固定列表头，滚动列表体”(“列表内部滚动条”)的功能
这个功能实现起来比我一开始想像的复杂
不是简单的使用一个 div overflow:scroll就可以搞定的
虽然功能是支持了 但是代码肯定还有很多bug或者是可以改进的地方
欢迎大家积极的提出宝贵的意见 谢谢了

使用方法：
ec:table标签内 增加
listHeight="数字" 属性 （指定列表体的高度）
同时把要指定 width="数字" 不能省略 同时要使用绝对大小 而不要使用百分比

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

部分增强功能简介：
（详见help.txt）

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

我们有自己的圈子了
以后大家有 ecside相关的问题 可以去圈子里
我的 blog里问( http://fins.iteye.com/blog/48723 ) 
别在发消息了 因为发消息别人看不到 而有些问题可能别人也遇到过 或者是我回答的不对 别人也可以帮忙
对吧?
谢谢大家

ecside发布地址：
http://fins.iteye.com/blog/40190
ecside圈子:
http://ecside.iteye.com/
ecside综合讨论专用帖
http://fins.iteye.com/blog/48723 

 

我申请了javascud项目 而且也申请了svn 但是不会用啊  :'( 谁来教教我啊

 

 依赖包已经上传到 圈子的共享空间里了

共3个 请解压缩后放到 WEB-INF/lib下 如果不导出pdf可以不下载pdf相关的包 和 字体文件 这两个比较大  

评论

239 楼 fins 2007-01-20  

对不起大家了
由于疏忽 早上发布的版本 有个大bug
:(
现在修正了

238 楼 fins 2007-01-20  

依赖包已经上传到 圈子的共享空间里了

237 楼 hxh1021 2007-01-20  

不错..我试一吧..

236 楼 fins 2007-01-20  

刚上传完代码就发现一个小隐患 不算是bug

ECSideAjaxResponseWrapper类
第133行左右:

        return content; //把return null 改成 content 更好

235 楼 ITeye管理员 2007-01-20  

fins 写道

javaeye 提供 的ftp里 置顶帖里的那个

JavaEye的FTP是临时的，ECSIDE的文件还是上传自己圈子的共享文件吧，看起来也比较清楚。

234 楼 fins 2007-01-20  

javaeye 提供 的ftp里 置顶帖里的那个

233 楼 lighter 2007-01-20  

不好意思,刚才发帖子太快了.找到了

232 楼 lighter 2007-01-20  

fins 写道

终于把依赖包上传完了
:(

新版本的依赖包在哪里啊??
刚才导入我的ide,看了一下,有错误,可能是依赖包的问题
java.lang.ClassNotFoundException: demo.common.HsqlListener
已经spring,hsqldb的包放到路径中去了

231 楼 fins 2007-01-20  

终于把依赖包上传完了
:(

230 楼 fins 2007-01-20  

发布了 累死了
呼呼
这几天我的本职工作都没怎么做
要休息一阵
ecside上的工作主要就是bug收集和需求收集
(但bug收集 但未必改,新功能收集 但未必加 时间有限啊)

我们有自己的圈子了
以后大家有 ecside相关的问题 可以去圈子里
我的 blog里问( http://fins.iteye.com/blog/48723 ) 
别在发消息了 因为发消息别人看不到 而有些问题可能别人也遇到过 或者是我回答的不对 别人也可以帮忙
对吧?
谢谢大家

ecside发布地址：
http://fins.iteye.com/blog/40190
ecside圈子:
http://ecside.iteye.com/
ecside综合讨论专用帖
http://fins.iteye.com/blog/48723 

229 楼 BIGN 2007-01-20  

感谢作者的辛勤劳动

228 楼 lighter 2007-01-19  

fins:
接下来的工作最好是完善一下ecside,重构优化,减少bug,新功能就看一下大家的意见啦;还有就是写写一点点的文档,这一排可能帮不上写文档的忙,因为在做东西整天编码多;待我研究比较熟悉了,会尽可能地帮忙一点点写一点文档,以使更多的人了解一下

227 楼 lighter 2007-01-19  

fins辛苦了;别饿坏了..
我很想看到新增的(1)(6)两个功能终于加上了/
今天一直想看新版本的发布,所以过一间隔就过来看看,想试一下新版本

226 楼 zack 2007-01-19  

一直在线上等着，虽然今天没有新版出来，但是也要请老兄当然身体哦，身体是革命的本钱哦。明天再来看

225 楼 fins 2007-01-19  

原本要今天发的新版本,但是太晚了

由于变化较大 完整版+jar包有14M 左右
明天再来传吧  中午晚上还都没吃呢

明天再发 明天一定发
(今天忙着开发 没有回答大家的各种问题 实在抱歉了 )

先发一下新特性 还有简易 logo :


===============================
2007-01-19 22点
===============================
沉寂两天，但一直没有闲着，带来了大变化。
1) 实现了灵活的可定制的“可编辑列表”功能 （详见help.txt 200行左右的描述 以及示例）
支持多种编辑方式（文本框 下拉框 将来还会支持更多），可自定义模版（使用自定义的文本框 下拉框），还提供了：
对可编辑列进行标识，对编辑过的cell进行标识（默认为改变单元格背景色），
使用ajax技术提交后台，提交成功的cell将清除编辑标识 等贴心设计。
2) 增加了 高亮显示选种行的功能，使用 ec:table属性: selectlightRow="true"
3) 去掉了 fullnavigation导航条，将其与navigation导航条合并
改为为ec:table增加属性 nearPageNum="数字" 用来设置导航条前后显示的邻近页数 等于0时 为不使用邻近页。
4) 为ec:table增加了 maxRowsExported="数字" 属性，用来限制导出大最大条数， 如果数据超过这个数目，则不执行导出操作。
5) 为之前增加的ec:table的pageSizeList属性 增加了特性
pageSizeList="max:200,10,15,30,50,100,all" 如果 10--100以及all中，某一项大过了max的200则 不在列表中显示。
也可以只使用pageSizeList="max:200" 此时将 使用默认设置，并进行max控制。
6) 解决了pdf中文编码问题，终于支持pdf导出了。
7) 恢复了对sitemesh的支持，用法见原版ec文档（我没有亲自没有测试,因为我不会用sitemesh ）。
8) Ajax翻页优化，同时增加了 ECSide.findAjaxZoneAtClien 属性，可设置 客户端 还是 服务端进行 html代码剪裁。
默认推荐使用 服务器端。
9) 再次对js和java代码进行了较大规模的重构,清理了一些无用代码，添加了必要的协议信息。
10) 还有一些细节的修改(例如对滚轮的支持更自然) 和对一些小bug的修正，但是由于变化较大，肯定还会带来一些新bug。
11) 整个示例的应用逐步发展为 ecside 的最佳实践，加入了hsqldb（hsqldb的使用参考了springside），全新的例子。
当然还不够好 会在以后的日子里继续完善。
12) 做了一个简单的logo。

224 楼 zack 2007-01-19  

昨天的问题找到了，是extremecomponents.tld文件中包含了没有定义的att，只要把extremecomponents.tld文件中的描述删除了就可以了，估计extremecomponents.tld还是用的extremecomponents带的

223 楼 jeffqin_fang 2007-01-19  

我引进了这个组件后，从数据库读取数据分页，
但是点击页面页数和上一页下一页，
都没有进入相应的action，也就是
var myAjax = new Ajax.Request( url,
{method: method, asynchronous: asy , parameters: pars, onComplete: resfunc } 中的url，
请问可能是什么原因，我的程序已经进入上面那段程序
且已经进入 resfunc。

222 楼 lformat 2007-01-19  

不知道什么时候发布啊，很期待。。。

221 楼 caryl 2007-01-19  

很是期待这个震撼的功能啊！！

220 楼 shim 2007-01-19  

遇到一个问题，我不是用Struts框架，而是用Struts2
结果其它一切正常，但导出为Excel时导不出数据（通过Action的方式）
有弹出保存框，但文件总为空
Action如下：

import javax.servlet.http.HttpServletRequest;

import org.extremecomponents.table.context.Context;
import org.extremecomponents.table.context.HttpServletRequestContext;
import org.extremecomponents.table.core.TableConstants;
import org.extremecomponents.table.limit.Limit;
import org.extremecomponents.table.limit.LimitFactory;
import org.extremecomponents.table.limit.TableLimit;
import org.extremecomponents.table.limit.TableLimitFactory;

public class ExtremeAction {

	public static int getTotalRowsFromRequest(HttpServletRequest request){
    	int totalRows=-1;
    	Integer totalRowsI=(Integer)request.getAttribute("totalRows");
    	try{
	    	if (totalRowsI!=null){
	    		totalRows=totalRowsI.intValue();
	    	}else{
	    		String ectableId=request.getParameter(TableConstants.EXTREME_COMPONENTS_INSTANCE);
	    		String totalRowsS=request.getParameter(ectableId+"_totalrows");
	    		totalRows=Integer.parseInt(totalRowsS);
	    	}
    	}catch(Exception e){
    		totalRows=-1;
    	}
    	totalRows=totalRows<0?-1:totalRows;
    	return totalRows;
    }
    public static int[] getRowStartEnd(HttpServletRequest request, int totalRows,int defautPageSize){
    	int offset=0;
    	return getRowStartEnd(request, totalRows,defautPageSize,offset);
    }
    public static int[] getRowStartEnd(HttpServletRequest request, int totalRows,int defautPageSize,int offset){
    	
    	Limit limit=getLimit(request, totalRows,defautPageSize);
    	return new int[]{limit.getRowStart()+offset,limit.getRowEnd()+offset};
    }
   public static Limit getLimit(HttpServletRequest request, int totalRows,int defautPageSize) {
        Context context = new HttpServletRequestContext(request);
        String tableId=request.getParameter(TableConstants.EXTREME_COMPONENTS_INSTANCE);
        if (tableId==null){
        	tableId=TableConstants.EXTREME_COMPONENTS;
        }
        LimitFactory limitFactory = new TableLimitFactory(context,tableId);
        TableLimit limit = new TableLimit(limitFactory);
        limit.setRowAttributes(totalRows, defautPageSize);
        request.setAttribute("totalRows", new Integer(totalRows));
        return limit;
    }
}

import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletRequest;
import org.apache.struts2.ServletActionContext;

public class MyTestAction extends ExtremeAction{

	static int DEFAULT_PAGE_SIZE = 10;
	
	public String execute(){
		HttpServletRequest request=ServletActionContext.getRequest();
		int totalRows = getTotalRowsFromRequest(request);
		if (totalRows < 0) {
			 // TODO �� ExampleBO.getTotalNum()Ϊ�ܹ�ȡ��������ķ��������滻Ϊʵ�ʵ�ʵ�֡�
			totalRows = ExampleBO.getTotalNum();
		}
        int[] rowStartEnd = getRowStartEnd(request, totalRows,DEFAULT_PAGE_SIZE);
		List rslist = ExampleBO.getDataList(rowStartEnd[0], rowStartEnd[1]);
		setToRequest("datalist",rslist);
		
		return "success";
	}
	
	protected void setToRequest(String name, Object value) {		
		ServletActionContext.getRequest().setAttribute(name,value);
	}
	}