Chinaunix首页 | 论坛 | 博客
  • 博客访问: 460465
  • 博文数量: 173
  • 博客积分: 2970
  • 博客等级: 少校
  • 技术积分: 1490
  • 用 户 组: 普通用户
  • 注册时间: 2008-06-11 14:35
文章存档

2011年(9)

2010年(17)

2009年(62)

2008年(85)

我的朋友

分类: Java

2008-07-07 09:13:34

使用JavaScript的情况有:
    一个常见的情况是在触发一个动作之前弹出一个确认对话框(例如:删除一条记录,取消编辑)。
    另一个常见的情况是在保存一些信息到服务器之前在客户端做验证,例如在传回服务器之前验证 password和Confirm password是否相等。
    这篇文章描述了在组件里如何触发客户端的java script功能。
    关联一个javascript和一个commandLink并不困难,但是为了能够成功关联你需要理解jsf是怎样解析组件的。
下面的例子说明了是怎么被解析成HTML的:
JSF代码:


相应的HTML代码:
 id="userForm:lnkDeleteUser">delete

这里有几点需要注意:
1,被解析成了超级链接
2,这个超链接的href是"#";基本上是个无用的值。
3,JSF为这个超链接的'onclick'事件生成了一堆java script。忽略细节,它主要是调用 submit()函数来提交表单。
4,第三行比较有意思--这个组件的id (“userForm::lnkDeleteUser”) 被保存在了一个 hidden元素里。这也是jsf是如何知道哪个组件触发提交表单的操作并正确的调用 服务器端actions的关键。

大多数JSF组件允许我们为客户端的DHTML事件(比如onclick,ondoubleclick,onfocus等)注入java script的。但在JSF代码:



相应的HTML代码:
    if (!confirm('Are you sure you want to delete this record?')) return false;
    clear_userForm();
    document.forms['userForm'].elements['userForm:_link_hidden_'].value='userForm:lnkDeleteUser';
    if (document.forms['userForm'].onsubmit){
        if (document.forms['userForm'].onsubmit())
           document.forms['userForm'].submit();
        } else {
           document.forms['userForm'].submit();
        }
    return false; "
 id="userForm::lnkDeleteUser">delete

另外一个需要注意的重点是javascript在任何情况下都不能返回true值。如果返回true值的话,浏览器将会执行-这只是指向了一个虚拟的页。
commandButton组件要相对简单一些,下面的脚本说明了如何加入一个确认对话框:
JSF代码:
相应的HTML代码:

在这里的commandButton被解析成了一个提交按钮。
如果javascript返回true值这个表单会被提交,如果返回false将会忽略表单的提交。
在JSF里成功使用javascript的关键是理解它是怎样被解析的。理解一些javascript会更好。另外需要小心的是语法,因为大多数IDE都不支持javascript的语法交验。如果你写了一个语法错误,例如少了一个打括号,代码将会简单的默默的执行失败:)
 
另外:如果再加个immediate="true",会使其去除不必要的生命周期过程,从而加快速度。
阅读(2220) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~