语源科技BlogJava-LiuTing

关于appfuse的探讨

LiuTing — Thu, 07 Jun 2007 15:56:00 GMT

项目在紧张的生活中很快就要结束了,一直以来,都是由于工作的繁忙,没有时间去写自己的blog.这段时间终于可以稍微闲下来了,觉得应该把这一阶段的工作总结一下了,但是拿起键盘,思绪却有些散乱,想写的很多,却也不知道怎么来写,还是慢慢来吧.
首先说一下整体框架appfuse，它是集成了当今最流行的web应用框架的更高层次的web开发框架．也可以说是一个web开发的基本平台，它将当前最流行的一些技术，比如hibernate,spring,struts,DBUnit,ant,log4j,xdoclet,sitemesh,velocity,jstl,webwork,等等都集成了进来，在国内能够将这些都应用进来的并不多见．

待续．．．．

LiuTing 2007-06-07 23:56 发表评论

JS常见函数

LiuTing — Tue, 29 May 2007 10:03:00 GMT

1.常规函数
　　javascript常规函数包括以下9个函数：
　　(1)alert函数：显示一个警告对话框，包括一个OK按钮。
　　(2)confirm函数：显示一个确认对话框，包括OK、Cancel按钮。
　　(3)escape函数：将字符转换成Unicode码。
　　(4)eval函数：计算表达式的结果。
　　(5)isNaN函数：测试是(true)否(false)不是一个数字。
　　(6)parseFloat函数：将字符串转换成符点数字形式。
　　(7)parseInt函数：将符串转换成整数数字形式(可指定几进制)。
　　(8)prompt函数：显示一个输入对话框，提示等待用户输入。例如：
　　(9)unescape函数：解码由escape函数编码的字符。
　　2.数组函数
　　javascript数组函数包括以下4个函数：
　　(1)join函数：转换并连接数组中的所有元素为一个字符串。例:

程序代码
　　　　function JoinDemo()
　　　　{
　　　　　var a, b;
　　　　　a = new Array(0,1,2,3,4);
　　　　　b = a.join("-");//分隔符
　　　　　return(b);//返回的b=="0-1-2-3-4"
　　　　}
　
　(2)langth函数：返回数组的长度。例：
　　　　
程序代码
function LengthDemo()
　　　　{
　　　　　var a, l;
　　　　　a = new Array(0,1,2,3,4);
　　　　　l = a.length;
　　　　　return(l);//l==5
　　　　}

　　(3)reverse函数：将数组元素顺序颠倒。例：
　　　
程序代码
function ReverseDemo()
　　　{
　　　　var a, l;
　　　　a = new Array(0,1,2,3,4);
　　　　l = a.reverse();
　　　　return(l);
　　　}
　　(4)sort函数：将数组元素重新排序。例：
　　　　
程序代码
function SortDemo()
　　　　{
　　　　　var a, l;
　　　　　a = new Array("X" ,"y" ,"d", "Z", "v","m","r");
　　　　　l = a.sort();
　　　　　return(l);
　　　　}
　　3.日期函数
　　javascript日期函数包括以下20个函数：
　　(1)getDate函数：返回日期的“日”部分，值为1～31。例：
　　　
程序代码
function DateDemo()
　　　{
　　　　var d, s = "Today's date is: ";
　　　　d = new Date();
　　　　s += (d.getMonth() + 1) + "/";
　　　　s += d.getDate() + "/";
　　　　s += d.getYear();
　　　　return(s);
　　　}
　　(2)getDay函数：返回星期几，值为0～6，其中0表示星期日，1表示星期一，...，6表示星期六。例：
　　　
程序代码
function DateDemo()
　　　{
　　　　var d, day, x, s = "Today is: ";
　　　　var x = new Array("Sunday", "Monday", "Tuesday");
　　　　var x = x.concat("Wednesday","Thursday", "Friday");
　　　　var x = x.concat("Saturday");
　　　　d = new Date();
　　　　day = d.getDay();
　　　　return(s += x[day]);
　　　}
　　(3)getHouse函数：返回日期的“小时”部分，值为0～23。例。
　　　
程序代码
function TimeDemo()
　　　{
　　　　var d, s = "The current local time is: ";
　　　　var c = ":";
　　　　d = new Date();
　　　　s += d.getHours() + c;
　　　　s += d.getMinutes() + c;
　　　　s += d.getSeconds() + c;
　　　　s += d.getMilliseconds();
　　　　return(s);
　　　}
　　(4)getMinutes函数：返回日期的“分钟”部分，值为0～59。见上例。
　　(5)getMonth函数：返回日期的“月”部分，值为0～11。其中0表示1月，2表示3月，...，11表示12月。见前面的例子。
　　(6)getSeconds函数：返回日期的“秒”部分，值为0～59。见前面的例子。
　　(7)getTime函数：返回系统时间。
　　　
程序代码
function GetTimeTest()
　　　{
　　　　var d, s, t;
　　　　var MinMilli = 1000 * 60;
　　　　var HrMilli = MinMilli * 60;
　　　　var DyMilli = HrMilli * 24;
　　　　d = new Date();
　　　　t = d.getTime();
　　　　s = "It's been "
　　　　s += Math.round(t / DyMilli) + " days since 1/1/70";
　　　　return(s);
　　　}
　　(8)getTimezoneOffset函数：返回此地区的时差(当地时间与GMT格林威治标准时间的地区时差)，单位为分钟。
　　　
程序代码
function TZDemo()
　　　{
　　　　var d, tz, s = "The current local time is ";
　　　　d = new Date();
　　　　tz = d.getTimezoneOffset();

　　　　if (tz 的链接点的名称，另一个函数link设定的URL地址。
　　(2)big函数：将字体加到一号，与...标签结果相同。
　　(3)blink函数：使字符串闪烁，与...标签结果相同。
　　(4)bold函数：使字体加粗，与...标签结果相同。
　　(5)charAt函数：返回字符串中指定的某个字符。
　　(6)fixed函数：将字体设定为固定宽度字体，与...标签结果相同。
　　(7)fontcolor函数：设定字体颜色，与标签结果相同。
　　(8)fontsize函数：设定字体大小，与标签结果相同。
　　(9)indexOf函数：返回字符串中第一个查找到的下标index，从左边开始查找。
　　(10)italics函数：使字体成为斜体字，与...标签结果相同。
　　(11)lastIndexOf函数：返回字符串中第一个查找到的下标index，从右边开始查找。
　　(12)length函数：返回字符串的长度。(不用带括号)
　　(13)link函数：产生一个超级链接，相当于设定的URL地址。
　　(14)small函数：将字体减小一号，与...标签结果相同。
　　(15)strike函数：在文本的中间加一条横线，与...标签结果相同。
　　(16)sub函数：显示字符串为下标字(subscript)。
　　(17)substring函数：返回字符串中指定的几个字符。
　　(18)sup函数：显示字符串为上标字(superscript)。
　　(19)toLowerCase函数：将字符串转换为小写。
　　(20)toUpperCase函数：将字符串转换为大写。

//校验是否全由数字组成

程序代码
function isDigit(s)
{
var patrn=/^[0-9]{1,20}$/;
if (!patrn.exec(s)) return false
return true
}

//校验登录名：只能输入5-20个以字母开头、可带数字、“_”、“.”的字串

程序代码
function isRegisterUserName(s)
{
var patrn=/^[a-zA-Z]{1}([a-zA-Z0-9]|[._]){4,19}$/;
if (!patrn.exec(s)) return false
return true
}

//校验用户姓名：只能输入1-30个以字母开头的字串

程序代码
function isTrueName(s)
{
var patrn=/^[a-zA-Z]{1,30}$/;
if (!patrn.exec(s)) return false
return true
}

//校验密码：只能输入6-20个字母、数字、下划线

程序代码
function isPasswd(s)
{
var patrn=/^(\w){6,20}$/;
if (!patrn.exec(s)) return false
return true
}

//校验普通电话、传真号码：可以“+”开头，除数字外，可含有“-”

程序代码
function isTel(s)
{
//var patrn=/^[+]{0,1}(\d){1,3}[ ]?([-]?(\d){1,12})+$/;
var patrn=/^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/;
if (!patrn.exec(s)) return false
return true
}

//校验手机号码：必须以数字开头，除数字外，可含有“-”

程序代码
function isMobil(s)
{
var patrn=/^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/;
if (!patrn.exec(s)) return false
return true
}

//校验邮政编码

程序代码
function isPostalCode(s)
{
//var patrn=/^[a-zA-Z0-9]{3,12}$/;
var patrn=/^[a-zA-Z0-9 ]{3,12}$/;
if (!patrn.exec(s)) return false
return true
}

//校验搜索关键字

程序代码
function isSearch(s)
{
var patrn=/^[^`~!@#$%^&*()+=|\\\][\]\{\}:;\'\,.<>/?]{1}[^`~!@$%^&()+=|\\\][\]\{\}:;\'\,.<>?]{0,19}$/;
if (!patrn.exec(s)) return false
return true
}

程序代码
function isIP(s) //by zergling
{
var patrn=/^[0-9.]{1,20}$/;
if (!patrn.exec(s)) return false
return true
}

LiuTing 2007-05-29 18:03 发表评论

DISPALYTAG的用法

LiuTing — Fri, 25 May 2007 02:42:00 GMT

1) Caption指标题
2) name：数据源
3) defaultsort：排序列，一般不需要
4) defaultorder：排序方式
5) class：表格显示的样式
6) varTotals：需要统计(总计)
7) decorator="totals"：表示使用指定的decorator。现在仅在同时使用小计、合计时用到，自己也可以定制。
8)   property指数据中的列名
  title指显示的标题
  format指数据的格式化样式，
  total表示该字段是否需要作统计。
  style="width:20%"可以设置宽度。
  也可以用


  表现。
  group="1"表示进行group的字段。
9) 在表格中建立一个连接：


  /holidayDefaultSearchStatView.do?type=
  &SYD=
  " target="_blank">



10) 由于该tag只有合计时，没有合计那一列，所以实现的时候以实现。
  可以通过totalMap对象获取合计的数据，如totalMap.colomn1获取合计的第一列数值。
11) 标题头不显示
12) 自己定制表头：
   使用decorator：

   org.displaytag.decorator.TotalTableDecorator totals =
   new org.displaytag.decorator.TotalTableDecorator();
       totals.setTotalLabel("合计");
       totals.setSubtotalLabel("小计");
       pageContext.setAttribute("totals", totals);

实例：
这是表标题
   name="${model.rowToColumnStatResult}" defaultsort="1"
  class="simple" defaultorder="ascending" varTotals="totalMap">


         var="mapEntry">


              title="${mapEntry.key}"
       format="{0,number,####.##}" total="true"/>




        title="小计"
      format="{0,number,####.##}" total="true"/>

  总计

          pattern="####.##"/>

另外一个例子：
varTotals="totalMap">

  总计

         pattern="####.####" />


         pattern="####.####" />

总计某一列的方法：
${totalMap.column?} ?为该列号
colspan="5"：表示这个单元格占5个单元格

项目名称开始日期负责人姓名挂靠单位经费来源项目总经费当年到款经费
                                                   531      400
                                                   151       10
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
总计                              682     500

LiuTing 2007-05-25 10:42 发表评论

DWRUtils API 使用方法

LiuTing — Sun, 20 May 2007 04:46:00 GMT

$("precloneNode1suf") 取得该对象;

DWRUtil.selectRange("selectRangeBasic", 5, 15) 选中selectRangeBasic文本框里面从第五个字符到第15个字符之间的字符.

DWRUtil._getSelection("selectRangeBasic") 得到selectRangeBasic文本框里选中的字符.

var arrayFive = [ 'One', 'Two', 'Three', 'Four', 'Five' ];
DWRUtil.addOptions('addOptionsBasic', arrayFive); 将数组添加到下拉菜单里面去;

DWRUtil.getValue('addOptionsBasic') 得到 addOptionsBasic 对象的值;
DWRUtil.getValue("precloneNode1Inner1suf", { textContent:true }); 后面加个参数,在 precloneNode1Inner1suf元素为"UL" 时,它返回了元素里面得值,也就是说去掉了HTML标签部分.

DWRUtil.getText('addOptionsBasic') 得到下拉框 addOptionsBasic 显示的文本;

var arrayObject = [
{ name:'One', value:'1' },
{ name:'Two', value:'2' },
{ name:'Three', value:'3' },
{ name:'Four', value:'4' },
{ name:'Five', value:'5' }
];
DWRUtil.addOptions('addOptionsObject1', arrayObject, "name"); 将数组添加到下拉菜单里面去;后面的参数是确定那个是给用户显示的文本,同时也是值;

DWRUtil.addOptions('addOptionsObject1', arrayObject, "name","value"); 同上,不过后面参数是: 3=文本;4=值;

var map = { one:1, two:2, three:3, four:4, five:5 };
DWRUtil.addOptions('addOptionsMap1', map); 同上, one 是值;1 是文本;
DWRUtil.addOptions('addOptionsMap1', map,true); 同上, 1 是值;one 是文本;

-------------------------------------------------------------------------------------

One
Two
Three
Four
Five

如果是列表显示,如上;则上面所有方法和select 下拉框使用一样;
-------------------------------------------------------------------------------------
DWRUtil.cloneNode('cloneNode1', { idPrefix:'pre', idSuffix:'suf' });克隆一个节点,参数一为要克隆的节点的id,第二个参数是在克隆的节点id前面加pre,后面加suf.(注意:如果该节点有子节点的话,子节点的名字也一样加)

DWRUtil.addRows(id, array, cellfuncs, [options]);
原理:

for each member in array
for each function in cellfuncs
create cell from cellfunc(array[i])
循环数组,循环函数,建立单元调用函数;(顺序决定)

例如:
DWRUtil.addRows('addRowsBasic', arrayFive, [
function(data) { return data; },
function(data) { return data.toUpperCase(); },
function(data) {
var input = document.createElement("input");
input.setAttribute("type", "button");
input.setAttribute("value", "DOM Test");
input.setAttribute("onclick", "alert('" + data + "');");
return input;
},
function(data) { return ""; }
]);

高级部分:
第四个参数为对单元的高级操作,主要下面的两个方法;
function defaultRowCreator(options) {
return document.createElement("tr");
};

function defaultCellCreator(options) {
return document.createElement("td");
};

例子:
DWRUtil.addRows( "demo2",[ 'Africa', 'America', 'Asia', 'Australasia', 'Europe' ] , cellFuncs, {
rowCreator:function(options) {
var row = document.createElement("tr");
var index = options.rowIndex * 50;
row.style.color = "rgb(" + index + ",0,0)";
return row;
},
cellCreator:function(options) {
var td = document.createElement("td");
var index = 255 - (options.rowIndex * 50);
td.style.backgroundColor = "rgb(" + index + ",255,255)";
td.style.fontWeight = "bold";
return td;
}
});

其中 options 参数的属性可用的为:(没试过,自己试试吧)

rowData: the element value from the array (the same for all cells in a row)
rowIndex: the key (if map) or index (if array) from the collection
rowNum: The row number counting from 0 in this section (so if you are using tbody, it counts rows in the tbody and not the whole table)
data: The 'computed' data value for the cell (cellCreators only)
cellNum: The cell number that we are altering counting from 0 (cellCreators only)

DWRUtil.setValues(); 批量设置值;
var settings = {
setValuesDiv:"setValuesDiv",
setValuesSpan:"setValuesSpan",
setValuesSelect:"two",
setValuesText:"setValuesText",
setValuesPassword:"AB",
setValuesTextarea:"setValuesTextarea",
setValuesButton1:"B1-Two",
setValuesButton2:"B2-Two",
setValuesRadio1:true,
setValuesRadio2:false,
setValuesRadio3:"one",
setValuesRadio4:"two",
setValuesCheckbox1:true,
setValuesCheckbox2:false
};
DWRUtil.setValues(settings);

DWRUtil.getValues(empty);批量获取值;
var empty = {
setValuesDiv:null,
setValuesSpan:null,
setValuesSelect:null,
setValuesText:null,
setValuesPassword:null,
setValuesTextarea:null,
setValuesButton1:null,
setValuesButton2:null,
setValuesRadio1:null,
setValuesRadio2:null,
setValuesRadio3:null,
setValuesRadio4:null,
setValuesCheckbox1:null,
setValuesCheckbox2:null
};
DWRUtil.getValues(empty);

DWRUtil.useLoadingMessage("Ping");//类似gmail那个样子,在右上角显示加载"ping";可用自定样式,具体查询;http://getahead.ltd.uk/dwr/browser/util/useloadingmessage

DWRUtil.toDescriptiveString("id",数字);弹出调试信息,数字为0,1,2.一级比一级高.

DWRUtil.onReturn(event, submitFunction);一般在form表单里面,防止在文本框上按回车就提交表单.
例如:
onkeypress="DWRUtil.onReturn(event, submitFunction)"/>

LiuTing 2007-05-20 12:46 发表评论

DWR框架实现Ajax

LiuTing — Sun, 20 May 2007 04:45:00 GMT

      Ajax是时下比较流行的一种web界面设计新思路,其核心思想是从浏览器获取XMLHttp对象与服务器端进行交互. DWR（Direct Web Remoting）就是实现了这种Ajax技术的一种web框架. 最近做的项目中我也将它用上了,感觉很是方便,比如动态生成javascript代码,隐藏的http协议,java代码和javascript交互的是javascript的对象(或字符串). 下面是我整理的文档.
DWR主要由两部门组成。javascript与web服务器通信并更新web页；运行在web服务器的Servlet处理请求并把响应发回浏览器。

   1 .  配置web.xml

dwr-invoker
class>uk.ltd.getahead.dwr.DWRServletclass>

dwr-invoker
/dwr/*

2    当我们想看dwr自动生成的测试页时,可在java代码
servlet中加

debug
true

这个参数DWR默认是false.如果选择true.我们可以通过url http://localhost:port/app/dwr ,你就可以看到你部署的每个DWR class。并且可以测试java代码的每个方法是否运行正常。为了安全考虑，在正式环境下你一定把这个参数设为false.

3 log信息配置

我喜欢用log4j输出日志,那么在log4j.properties下加，log4j.logger.uk.ltd.getahead.dwr = debug。这样可以看DWR的调试日志。

4 配置dwr.xml (和web.xml同目录)

这里的多数元素都是可选的 - 你真正必须知道的是指定一个creator和一个javascript名字。

creator属性 是必须的 - 它用来指定使用那种创造器。

默认情况下DWR1.1有8种创造器。它们是：

new: 用Java的new关键字创造对象。
none: 它不创建对象，看下面的原因。 (v1.1+)
scripted: 通过BSF使用脚本语言创建对象，例如BeanShell或Groovy。
spring: 通过Spring框架访问Bean。
jsf: 使用JSF的Bean。 (v1.1+)
struts: 使用Struts的FormBean。 (v1.1+)
pageflow: 访问Beehive或Weblogic的PageFlow。 (v1.1+)

javascript属性 用于指定浏览器中这个被创造出来的对象的名字。你不能使用Javascript的关键字。

scope属性 非常类似servlet规范中的scope。它允许你指定这个bean在什么生命范围。选项有"application", "session", "request" 和"page"。这些值对于Servlet和JSP开发者来说应该相当熟悉了。

scope属性是可选的。默认是"page"。如果要使用"session"需要cookies。当前的DWR不支持ULR重写。

param元素 被用来指定创造器的其他参数，每种构造器各有不同。例如，"new"创造器需要知道要创建的对象类型是什么。每一个创造器的参数在各自的文档中能找到。请查看上面的链接。

include和exclude元素 允许创造器来限制类中方法的访问。一个创造器必须指定include列表或exclude列表之一。如果是include列表则暗示默认的访问策略是"拒绝"；如果是exclude列表则暗示默认的访问策略是"允许"。

5 dwr.jar下载后放lib下

源码浅析

dwr的设计很象webwork2的设计,隐藏http协议,扩展性，兼容性及强。

通过研究uk.ltd.getahead.dwr.DWRServlet这个servlet来研究下dwr到底是如何工作的。

dwr-invoker
class>uk.ltd.getahead.dwr.DWRServletclass>

dwr-invoker
/dwr/*

这样/dwr/*下的所有的请求都是由这个servlet来处理,到底生理了什么呢,我们还是以例子来说明吧.

1 web服务器启动，DWRServlet init()方法调用，init主要做了以下工作。
设置日志级别、实例化DWR用到的单例类（这些类在jvm中只有一个实例对象）、读去配置文件（包括dwr.jar包中的dwr.xml,WEB-INF/dwr.xml. config*.xml）。
2 请求处理
DWRServlet.doGet, doPost方法都调用processor.handle(req, resp)方法处理。Processor对象在init()方法中已经初始化了。

代码
public void handle(HttpServletRequest req, HttpServletResponse resp)
        throws IOException
    {
        String pathinfo = req.getPathInfo();
        if(pathinfo == null || pathinfo.length() == 0 || pathinfo.equals("/"))
        {
            resp.sendRedirect(req.getContextPath() + req.getServletPath() + '/' + "index.html");
        } else
        if(pathinfo != null && pathinfo.equalsIgnoreCase("/index.html"))
        {
            doIndex(req, resp);
        } else
        if(pathinfo != null && pathinfo.startsWith("/test/"))
        {
            doTest(req, resp);
        } else
        if(pathinfo != null && pathinfo.equalsIgnoreCase("/engine.js"))
        {
            doFile(resp, "engine.js", "text/javascript");
        } else
        if(pathinfo != null && pathinfo.equalsIgnoreCase("/util.js"))
        {
            doFile(resp, "util.js", "text/javascript");
        } else
        if(pathinfo != null && pathinfo.equalsIgnoreCase("/deprecated.js"))
        {
            doFile(resp, "deprecated.js", "text/javascript");
        } else
        if(pathinfo != null && pathinfo.startsWith("/interface/"))
        {
            doInterface(req, resp);
        } else
        if(pathinfo != null && pathinfo.startsWith("/exec"))
        {
            doExec(req, resp);
        } else
        {
            log.warn("Page not found. In debug/test mode try viewing /[WEB-APP]/dwr/");
            resp.sendError(404);
        }
    }

dwr/*处理的请求也就这几种。

（1）dwr/index.html，dwr/test/这种只能在debug模式下使用，调试用。
dwr/engine.js，dwr/util.js，dwr/deprecated.js当这个请求到达，从dwr.jar包中读取文件流，响应回去。（重复请求有缓存）
（2）当dwr/interface/这种请求到来，（例如我们在index.html中的）DWR做一件伟大的事。把我们在WEB-INF/dwr.xml中的

java.util.Date转化为javascript函数。
http://localhost:port/simpledwr/dwr/interface/JDate.js看看吧。
细节也比较简单，通过java反射，把方法都写成javascript特定的方法。（我觉得这些转换可以放到缓存里，下次调用没必要再生成一遍，不知道作者为什么没这样做）。
（3）dwr/exec
javascript调用方法时发送这种请求，可能是XMLHttpRequest或IFrame发送。
当然，javascript调用的方法签名与java代码一致，包括参数，还有javascript的回调方法也传到了服务器端，在服务器端很容易实现。回调方法的java的执行结果返回类似