crabdave

Open Flash Chart组件的使用

crabdave — Mon, 05 May 2008 11:52:50 +0800

作者: crabdave 链接：http://crabdave.javaeye.com/blog/189653 发表时间: 2008年05月05日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

Open Flash Chart组件的使用

简介

OpenFlashChart是一个开源的报表制作组件，该组件能够自动生成一个好看的、动态的flash报表；该组件使用flash展示报表能够很好的做到与浏览器进行集成，目前浏览器基本都能很好的支持flash；该组件还支持一些简单的JavaScript，提供在图形上对外部URL的链接；该组件非常小，java类一共不超过10个，可操作的API也很少，这样学习起来也非常容易上手。但可阅读的文档非常少，在与其它框架集成方面还有些问题。

主要配置项：

Ø openflashchart.jar:Open Flash Chart组件，工程开始时引入(lib目录下)。

Ø open-flash-chart.swf:Flash文件接口，通过该文件来生成Flash文件，备页面调用(在web目录下，与WEB-INF目录并级)。

Ø swfobject.js:Flash文件依赖的JS文件(在web目录下，与WEB-INF目录并级)。

Open Flash Chart主要有：HTML、JSP、Servlet等三种使用方式。其具体介绍参见附件中(在这里发表文章好像还有篇幅的限制...)。在附件中还提供了Demo和ofc的文档，供大家下载研究。

备注和补充说明：

1、该组件支持java 1.5以上版本。

2、利用Servlet API输出数据时应该注意设置编码，防止出现乱码。

如：response.setCharacterEncoding("utf-8");//设置字符集，在项目中使用utf-8页面不会出现乱码。

3、在页面Object标签中如果要开启外链支持，需要设置allowScriptAccess=always(默认为sameDomain，即不允许跨域访问)允许突破同源策略访问外部链接或者执行Javascript代码。

4、在图形链接时如果指定的是调用Javascript代码，注意应该避免出现逗号，因为这个设置是作为字符串（可能包括多个图形的链接，同时以逗号分隔）传递给Flash接口的，它会对这个字符串利用逗号进行split，从而出现Javascript解析错误，无法正确执行Javascript代码。

5、OFC4J对OpenFlashChart的面向对象封装很好，但是目前版本不支持图形链接。

在项目使用过程中，发现在与公司开发框架的集成过程中出现一些问题：

1) 同样版本的IE，有的IE访问时出现JavaScript错误，而有的IE却很正常；

2) 所有图形输出之前全都设置相同的字符集，却出现在有的图形中出现乱码，而在有的图形中中文显示正常。而另一个项目组在开发桌面应用时使用的就是该组件，却一直很正常，没有出现大的问题。

该组件还不是很成熟，在我们开发报表，选择第三方组件时，应该谨慎。本人建议还是采用目前比较成熟的jFreeChart组件进行报表的开发。

本文的讨论也很精彩，浏览讨论>>

JavaEye推荐

批量插入一个select出来的结果集，如果被插入的表里原本有某条记录时就不重复插入的SQL(DB2)

crabdave — Sun, 04 May 2008 17:18:13 +0800

作者: crabdave 链接：http://crabdave.javaeye.com/blog/189440 发表时间: 2008年05月04日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

问题：项目中需要批量插入一个select出来的结果集，如果被插入的表里原本就有某条记录的时候不能重复插入的SQL(DB2)。

环境描述：
1)有两个表，加一些限制条件后，从tableNameB中select出一个结果集，再将其不重复地插入到tableNameA表中去。
2)tableNameB表中没有主键，三个字段A，B，C能够唯一确定一条记录。

解决方案：
1)从talbeNameB中加上限制条件后select出一个结果集。
2)将这个结果集与被插入表进行左外连接。
3)加上这三个字段相等的限制，如果关联不为null，表示被插入表中有这行记录；否则，表示tableNameA表中没有这行记录，可以进行插入操作。

参考实现：
代码如下：
insert into tableNameA
select
   b.A ,b.B ,b.C ,b.D ,b.E ,b.F ,
     from (
       select tab.*,row_number()over(partition by tab.A,tab.B,tab.C) req --去掉重复记录
         from tableNameB tab
          where tab.A like 'a'    --加入select的限制条件
              and tab.B=1
          ) b
   left outer join tableNameA c    --左外连接
    on b.A=c.A   --判断tableNameA表中是否有重复的记录，三个相等条件确定唯一记录
     and b.B=c.B
     and b.C=c.C
     where b.req=1   --在select时有重复记录，则取第一条记录
     and c.A is null ;

本文的讨论也很精彩，浏览讨论>>

JavaEye推荐

批量更新某一查询结果集的第N条到第M条的记录的SQL(DB2)

crabdave — Sun, 04 May 2008 16:41:12 +0800

作者: crabdave 链接：http://crabdave.javaeye.com/blog/189409 发表时间: 2008年05月04日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

问题：在项目开发中，我们有时候需要根据一些限制条件查询出一个结果集后，再将这个结果集的比如前10行进行某一update操作，后10行再进行另一个update操作。

解决方案：
1)根据限制条件查询出结果集(该结果集应该以其主键进行排序)，在该结果集上给各行记录进行编号。
2)根据各行记录的编号取出一次取出前10行的记录或后10行的记录。
3)进行各自的update操作。

参考实现：
以下将以我在项目中多次用到的SQL为例。
代码如下：
update tableName b
set b.A=2 ,b.B=current date --B字段为日期类型
where exists (
   select 1 from (
      select a.id,row_number()over(order by a.id) req --以tableName表的主键id字段进行排序
         from tableName a where a.C =22 and a.D=1) c --加上查询结果集的限制条件
where b.id=c.id and c.req>=1 and c.req<=3);--将要更新查询结果集的第1到第3条记录

本文的讨论也很精彩，浏览讨论>>

JavaEye推荐

屏蔽IE右键功能

crabdave — Sun, 04 May 2008 14:55:59 +0800

作者: crabdave 链接：http://crabdave.javaeye.com/blog/189360 发表时间: 2008年05月04日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

New Document

屏蔽IE右键功能

本文的讨论也很精彩，浏览讨论>>

JavaEye推荐

关于ECSdie列表中隔页存值的问题(CheckBox_Select)

crabdave — Wed, 30 Apr 2008 18:29:45 +0800

作者: crabdave 链接：http://crabdave.javaeye.com/blog/188517 发表时间: 2008年04月30日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

问题：在ECSide列表中，每行都有select标签，用户在第一页进行各行的select选择之后，执行页面翻页操作，翻到第二页，再回到第一页时不能回显原先对各行select标签所做的选择。同样还有对列表进行排序、修改每页显示行数等打乱现有列表排列的操作。

环境描述:
1)在ECSide列表中，保存用户所选择的每行select值，在用户执行页面翻页、排序、修改每页显示行数后，
仍能回显出原先用户所选的select值。在用户点击提交或保存操作后能将用户在不同页所选的值提交到后台。
2)select值的形式：用户所选值_本行记录的ID，例如：OptionValue_132
3)确保ECSdie列表所在页面在执行页面翻页、排序、修改每页显示行数等操作时，整个页面局部刷新(如果整个页面刷新将会清除后面将要提到的一个JavaScript全局变量)。
4)关闭ECSide列表标签中的隔页存值属性(autoIncludeParameters)，使用该属性虽然可以达到隔页存值的目的，但不能回显原先用户所做的选择，并且在每次在执行页面翻页、排序、修改每页显示行数等操作时，不停的在创建hidden标签。

解决方案：
1)在用户点击select进行选值时，将其所选值存入一个作为全局变量的数组，并且在往该数组中存入用户所选值时，以该行记录的ID作为数组下标，将对应的值存入数组。在用户对select值进行修改时，取出该ID对应的数组下标的值，进行修改操作，若置回请选择时，根据该行记录的ID作为索引找到数组中对应的值，清空数组中的该值。
2)用户在执行页面翻页、排序、修改每页显示行数后，取出当页所有select对象，将这些select对象与数组中的值进行匹配，如果有对应下标的值将其回显出来。回显的时候需要从ecside.js中抽象出一个JavaScript函数用于在执行页面翻页、排序、修改每页显示行数后执行。
对ecside.js的修改如下：
(1)翻页：在ECSideUtil.gotoPage方法中取到新页面的HTML时(即执行ecsideObj.ajaxSubmit()之后)。
(2)排序：在ECSideUtil.doSort方法中取到新页面的HTML时(即执行ecsideObj.ajaxSubmit()之后)。
(3)修改每页显示多行：在ECSideUtil.changeRowsDisplayed方法中取到新页面的HTML时(即执行ecsideObj.ajaxSubmit()之后)。
在以上三个方法之后添加如下代码：
try{
//新的HMTL加载完后执行的函数
setAfterView();
}catch(e){

}
这样我们在每个开发的页面，直接写function setAfterView(){}函数就可以实现要回显的操作了。
3)在用户点击“保存”或“提交”时，将数组中的值生成hidden连接到页面form中，提交到后台。
var tempHid="";
if(saveSelValues!=null&&saveSelValues.length>0){//如果数组中有值
for(var i=parseInt(custIdTemp,10);i if(saveSelValues[i]!=null){
tempHid+="";//创建hidden标签,其中value值中的i(即数组的索引为每行记录的ID号)。
}
}
if(tempHid!=""){
document.forms[0].insertAdjacentHTML("beforeEnd", tempHid);//将数组中的值生成hidden连接到页面form中
}
}
4)在后台通过java的split("_")方法取出各ID所对应的用户所选值，之后再进行数据库操作。

备注：这种方式还适合于ECSide列表各中行的CheckBox、二级联动的select标签等的隔页存值问题。

参考实现：以下将以我在项目中开发的在ECSide列表中各行CheckBox和二级联动的select标签的隔页存值为例。
描述：在EC列表中，第一列为CheckBox(进入列表页面默认都被选中)，最后两列为一个二级联动的select标签(在CheckBox不被选中时，显示为可用，即默认为disabled)。
代码如下：
CheckBox:(第一列)

Select:(最后两列)
二级select菜单
其中1_1中的第一个1表示一级菜单1的value值，第二个1表示二级菜单1的value值

准备select菜单数据：
//准备一级菜单数据
var delType=new Array();

delType[0]=new Array();
delType[0].push('一级菜单1');
delType[0].push('1');

delType[1]=new Array();
delType[1].push('一级菜单2');
delType[1].push('2');

//准备二级菜单数据
var delReas=new Array();

delReas[0]=new Array();
delReas[0].push('二级菜单1');
delReas[0].push('1');
delReas[0].push('1'); //属于一级菜单1

delReas[1]=new Array();
delReas[1].push('二级菜单2');
delReas[1].push('2');
delReas[1].push('1'); //属于一级菜单1

delReas[2]=new Array();
delReas[2].push('二级菜单3');
delReas[2].push('3');
delReas[2].push('2'); //属于一级菜单2
JavaScript函数：
//根据所选的一级菜单展示二级菜单
function selSecondSel(firstSel){
//取出一级菜单选择的是哪一个
var sel_Index = firstSel.selectedIndex;
var temp=firstSel.options[sel_Index].value;
var rowCode=firstSel.typeId;
//设置二级菜单
var sel_Obj_s=document.getElementById("secondSel_"+rowCode);
sel_Obj_s.innerHTML="";
var flag=true;
//alert(delReas.length);
for(var i=0;i if(delReas[i][2]==temp){

var oOption = document.createElement("OPTION");
sel_Obj_s.options.add(oOption);
oOption.innerText = delReas[i][0];
oOption.value = delReas[i][2]+"_"+delReas[i][1];
if(flag){
saveSelValues[rowCode]=delReas[i][2]+"_"+delReas[i][1];
// alert("4_saveSelValues["+rowCode+"]="+saveSelValues[rowCode]);
flag=false;
}

}
}
}

//将客户列表的checkbox和select设置为可用
function enableCheckSel(){

var dcc=document.getElementsByName("delCustCheck");
if(dcc!=null&&dcc.length>0){
for(var i=0;i dcc[i].disabled="";
}
}
if(saveSelValues!=null&&saveSelValues.length>0){
var temp=document.getElementsByTagName("select");
for(var i=0;i if(temp[i].typeId!=undefined&&temp[i]!=null){
if(saveSelValues[temp[i].typeId]!=undefined&&saveSelValues[temp[i].typeId]!=null&&saveSelValues[temp[i].typeId]!=""){
temp[i].disabled="";
}
}
}
}
}

//点击checkbox时执行
var custIdTemp=0;//记录用户所点选过的最小值
function abledSel(abledSel){
var as=abledSel.value;
if(parseInt(custIdTemp,10)==0){
custIdTemp=as;
}
if(parseInt(as,10) custIdTemp=as;
}
var ce=abledSel.checked

var temp=new Array();
temp[0]=document.getElementById("firstSel_"+as);
temp[1]=document.getElementById("secondSel_"+as);
if(temp.length>0){
for(var i=0;i var selRowCode=as;
if(ce){//如果checkbox变为被选中，select标签不可用，清除数组中的存值
temp[i].disabled="true";
saveSelValues[selRowCode]=null;
}else{//如果checkbox变为没有被选中，将对应的select标签设置为可用，在数组中添加相应的select值
temp[i].disabled="";
if(temp[i].id==("secondSel_"+selRowCode)){
var sel_Index = temp[i].selectedIndex;
var temp1=temp[i].options[sel_Index].value;
saveSelValues[selRowCode]=temp1;
}
}
}
}
}
//保存用户所选value值的数组
var saveSelValues=new Array();
//保存用户所选的select值
function saveSelValue(sel_Obj){
//取出一级菜单选择的是哪一个
var sel_Index = sel_Obj.selectedIndex;
var temp=sel_Obj.options[sel_Index].value;
var selRowCode=sel_Obj.typeId;
saveSelValues[selRowCode]=temp;
}
//在列表执行页面翻页、排序、修改每页显示行数等操作后执行回显
function setAfterView(){
if(saveSelValues!=null&&saveSelValues.length>0){
var delCustCheck=document.getElementsByName("delCustCheck");
for(var k=0;k var i=delCustCheck[k].typeId;
if(saveSelValues[i]!=null){
var firstSel=document.getElementById("firstSel_"+i);
var secondSel=document.getElementById("secondSel_"+i);
if(firstSel==undefined||firstSel==null||secondSel==undefined||secondSel==null){
continue;
}
delCustCheck[k].checked="";
if(firstSel!=undefined&&firstSel!=null&&secondSel!=undefined&&secondSel!=null){
var temp=saveSelValues[i].split("_");
firstSel.disabled="";
secondSel.disabled="";
firstSel.value=temp[0];
temp=saveSelValues[i];
selSecondSel(firstSel);//执行该函数后会将该二级菜单的第一个选项存入数组，注意将原值保留，修改数组中的该值
secondSel.value=temp;
saveSelValues[i]=temp;
}
}
}
}
}

注意：JavaScript里数组的最大长度是： 4294967295，即2^32 - 1，数组的下标（即该行记录的ID）不要超过这个数。

以上仅为一个小小的参考实现，不过在效率上可能还有些欠缺，还有待优化，希望能启到抛砖引玉的作用。
本文的讨论也很精彩，浏览讨论>>

JavaEye推荐

关于在EC列表页面点击标题查看明细后不能回到原来所在页的问题

crabdave — Wed, 30 Apr 2008 11:50:02 +0800

作者: crabdave 链接：http://crabdave.javaeye.com/blog/188353 发表时间: 2008年04月30日

声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！

问题：在使用ECside分页框架的过程中，我们在EC列表页面点击某一行记录,进入该行记录的详细信息页面，此时我们在返回时却又只能返回到第一页，不能返回原来所在的第二页。其中还有原来我们设置好的每页显示多少行，也变回原来的默认值了，排序方式也变成默认的了。
解决方案：在明细页面点击返回时，需要带上几个参数，并且这些参数要用hidden来存储，ECside框架会用request.getParameter()方法来取值。
主要参数如下：
ec_i存储的是EC列表的tableId,该tableId为StrategyListTable
StrategyListTable_crd存储的是每页显示多少行，该参数名是由tableId+"_crd"组成
StrategyListTable_p存储的是当前是第几页，该参数名是由tableId+"_p"组成
StrategyListTable_s_strategyName存储的是用户选择的排序字段和方式，该参数名是由tableId+"_s_"+排序字段组成，它的value值为asc和desc可选，表示排序方式。
参考实现：在我的参与的项目开发过程中，我们的系统采用Struts+Spring+Hibernate，所有的action都继承自BaseAction,我们直接在这个基类中取出这些参数，再将其传入明细页面，在明细页面只用拷贝几行固定的代码，在返回提交表单的时候，顺便提交一下这些参数就OK了。
BaseAction中的代码：
String ec_i="";
ec_i=req.getParameter("ec_i");

if(ec_i!=null&&!ec_i.equals("")){//存在EC显示属性
String cp=req.getParameter(ec_i+"_p");//取出当前第几页
String crd=req.getParameter(ec_i+"_crd");//取出每页多少行
String sort=req.getParameter("sort");//取出排序方式
String sortProp=req.getParameter("sortProp");//取出排序字段
//判断前台是否有排序信息，如果前台没有排序，则这两个属性都是null
if(sort!=null&&!sort.equals("")&&sortProp!=null&&!sortProp.equals("")){
log.info("原页面取到的排序属性为："+sortProp+"方式为："+sort);
req.setAttribute("ECSort", sort);
req.setAttribute("ECSortProp",sortProp);
}
log.info("原页面提交的列表名称为："+ec_i+" 当前是第 "+cp+" 页，每页显示 "+crd+" 行");
req.setAttribute("ECI", ec_i);
req.setAttribute("ECTable_p", cp);
req.setAttribute("ECTable_crd", crd);
}
明细页面的固定代码：

备注：在项目开发过程中，会有这种情况：从第一个EC列表中点击某行记录进入明细页面，而在这个明细页面中，还有EC列表，在这种情况下，以上这些参数就会重复出现，但ECside框架只会取出其中一个，这时候要注意，在明细页面返回上一个EC列表的时候，要提交上一个EC列表的参数。
本文的讨论也很精彩，浏览讨论>>

JavaEye推荐