`

jsf中通过javascript调用事件或者监听器。。。[ZT]

    博客分类:
  • Jsf
阅读更多
WEB应用通常需要响应用户事件,比如选择菜单项目或者单击按钮。例如,响应用户对地址表单中的国家选择,更改场所和加载当前页面以更好的适应用户。

通常,可以与组件一起注册事件处理器;例如,可以在JSF页面中使用菜单来注册值变化监听器。如:

JSF代码
 
  1. <h:selectOneMenu id="select" valueChangeListener="#{user.myEvent}" onchange="submit();"  
  2.    value="#{user.selectedContent}">  
  3.      <f:selectItems value="#{user.countryItems}"></f:selectItems>  
  4. </h:selectOneMenu>  


在上述代码中,方法绑定#{user.myEvent}引用form bean的myEvent方法,当用户从菜单中作出选择之后,JSF实现调用该方法。

JSF支持三种类型的事件:
值变化事件
动作事件
阶段事件

当输入组件的值发生变化并且比较表单时,值变化事件由该输入组件触发,例如: h:inputText,h:selectRadio,h:selectManyMenu。

当激活按钮或连接时,命令组件(如:h:commandButton和h:commandLink)会触发动作事件。

生命周期事件

JSF应用程序中的请求由JSF实现产生――该JSF实现通常时一个控制器servlet――然后执行JSF生命周期。JSF生命周期包括下列阶段:

Restore View(恢复视图)
Apply Request Values(应用请求值)
Process Validations(处理验证)
Update Model Values(更新模型值)
Invoke Application(调用应用程序)
Render Response(呈现响应)

在用户再次访问JSF页面时,恢复视图阶段将重新创建服务器组件树,应用请求值阶段将请求参数(request parameters)复制到组件提交值(submitted value)中。处理验证阶段首先转换这些提交的值并验证转换后的值。更新模型值将转换后和验证过的值复制到模型中。这通常是由JSF页面中值引用表达式 所表示,如:
JSF代码
 
  1. <h:inputText value=”#{user.name}”/>  

<h:inputtext value="”#{user.name}”/">
调用应用程序阶段调用动作监听器和动作,可以在一个组件中注册动作监听器和动作。
<h:commandbutton action="”#{bean.action}”" actionlistener="”#{bean.listener}”/">
JSF 代码
 
  1. <h:commandButton action=”#{bean.action}” actionListener=”#{bean.listener}”/>  


在这里,JSF实现将调用该bean的listener方法,接着是action方法.

最后,呈现响应阶段保存状态并加载下一个视图,对于JSP应用程序,JSF导航处理器或者转发或者重定向到另一个JSF页面,转发是默认的行为,但是可以在faces配置文件中使用redirect元素指定重定向。

从应用请求值阶段开始,事件被创建和放置到每个生命周期中的一个事件序列中。完成这些阶段之后,JSF实现将这些排队的事件传播到注册的监听器上。

每个监听器都会以下列三种方法之一来影响JSF生命周期:1。生命周期正常进行;2。调用FacesContext.renderResponse()来 跳过生命周期的其他部分,而直接到呈现响应;3。调用FacesContext.responseComplete ()来跳过生命周期的其他所有部分。
</h:commandbutton></h:inputtext>
1

值变化事件
Web应用程序中的组件通常是相互依赖的。可以使得所依赖的组件与值变化事件保持同步。例如,下图显示的应用程序,当选择下拉框中的内容时,在下面显示所选中的内容。这在验证了新值和提交关闭之后由输入组件触发。


上图显示的应用程序将一个值变化监听器连接到select菜单,并使用onchange属性来在菜单值变化之后强迫执行表单提交:

JSF代码
 
  1. <h:selectOneMenu id="select" valueChangeListener="#{user.myEvent}" onchange="submit();"  
  2.    value="#{user.selectedContent}">  
  3.    <f:selectItems value="#{user.countryItems}"></f:selectItems>  
  4. </h:selectOneMenu>  


当用户从菜单中选择一个国家时,JavaScript submit函数将被调用来提交菜单的表单,然后它调用JSF生命周期。在处理验证阶段,JSF实现将调用form bean的myEvent()方法。这个方法将根据新的selectedContent值来更改视图的场所:

java 代码
 
  1. /* 
  2. * Copyright (c) 2006,Science And Technology Of NCEPU 
  3. * All rights reserved. 
  4. * 
  5. * FileName:filename 
  6. * Description:description of the file 
  7. * 
  8. * Version:1.0 
  9. * Author:gmplayer 
  10. * FinishDate:2007-3-29 
  11. * 
  12. * http://www.ncepu.edu.cn 
  13. */  
  14. package jsf;  
  15. import javax.faces.event.ActionEvent;  
  16. import javax.faces.event.ValueChangeEvent;  
  17. import javax.faces.context.FacesContext;  
  18. import javax.faces.model.SelectItem;  
  19. import java.util.ArrayList;  
  20. import java.util.Collection;  
  21. import java.util.List;  
  22. import java.util.Locale;  
  23. public class UserBean ...{  
  24.     String result;  
  25.     String input;  
  26.     private ArrayList countryItems = null;  
  27.     private String selectedContent = null;  
  28.     public String getSelectedContent() ...{  
  29.     return selectedContent;  
  30.     }  
  31.     public void setSelectedContent(String selectedContent) ...{ //保持下拉框的状态不改变  
  32.     this.selectedContent = selectedContent;  
  33.     }  
  34.     public String getResult() ...{  
  35.         return result;  
  36.     }  
  37.     public void setResult(String result) ...{  
  38.         this.result = result;  
  39.     }  
  40.     public void listen(ActionEvent e) ...{ //按钮点击时触发的事件  
  41.         FacesContext context = FacesContext.getCurrentInstance();  
  42.         String myclientId = e.getComponent().getClientId(context);  
  43.         String clientId = e.getComponent().getId();  
  44.         if (clientId.equals("btnSubmitAdd"))  
  45.             setResult(getInput());  
  46.         }  
  47.   
  48.     public void myEvent(ValueChangeEvent e) ...{ //下拉框改变时触发的事件  
  49.         FacesContext context = FacesContext.getCurrentInstance();  
  50.         String clientId = e.getComponent().getId();  
  51.         if (clientId.equals("select")) ...{  
  52.             setResult(e.getNewValue().toString());  
  53.         }  
  54.         }  
  55.     public String getInput() ...{  
  56.         return input;  
  57.     }  
  58.     public void setInput(String input) ...{  
  59.         this.input = input;  
  60.     }  
  61.     public Collection getCountryItems() ...{ //给下拉框赋值  
  62.         SelectItem aa= new SelectItem();  
  63.         if (countryItems == null) ...{  
  64.         countryItems = new ArrayList();  
  65.         countryItems.add(new SelectItem("Sun""Sun"null));  
  66.         countryItems.add(new SelectItem("Month""Month"null));  
  67.         countryItems.add(new SelectItem("Earth""Earth"null));  
  68.         }  
  69.         return countryItems;  
  70.         }  
  71.         public void setCountryItems(ArrayList<selectitem> countryItems) ...{  </selectitem>
  72.         this.countryItems = countryItems;  
  73.         }  
1

与所有值变化监听器一样,上述监听器将传递一个值变化事件,该监听器使用该事件来访问组件的新值。ValueChangeEventl类扩展了FacesEvent,两个类都位于javax.faces.event包中。下面列出了这些类中的常用方法:
javax.faces.event.ValueChangeEvent

UIConponent getComponent()
返回触发事件的输入组件
Object getNewValue()
当转换和验证新值后,返回组件的新值
Object getOldValue()
返回组件的以前值

Javax.faces.event.FacesEvent

Void queue()
将传送事件放到当前生命周期阶段的末端并排队等待
PhaseID getPhaseId()
返回对应于发送事件阶段的阶段标识符
Void setPaseId(PhaseId)
设置对应于发送事件阶段的阶段标识符

上图的页面代码为:

Myjsp.jsp
 
  1. <%@ page language="java" pageEncoding="ISO-8859-1"%>  
  2. <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>  
  3. <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>  
  4.   
  5. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  6. <html>  
  7.     <f:view>  
  8.         <head>  
  9.             <title>This is the first JSF example!</title>  
  10.         </head>  
  11.         <body>  
  12.             <h:form>  
  13.                 <h:inputText value="#{user.input}" id="input" />  
  14.                 <h:selectOneMenu id="select" valueChangeListener="#{user.myEvent}"  
  15.                     onchange="submit()" value="#{user.selectedContent}">  
  16.                     <f:selectItems value="#{user.countryItems}"></f:selectItems>  
  17.                 </h:selectOneMenu>  
  18.   
  19.                 <p>  
  20.                     <h:commandButton value="Login" action="login" id="btnSubmitAdd"  
  21.                         actionListener="#{user.listen}" />  
  22.                 </p>  
  23.                 <h:outputText value="#{user.result}" />  
  24.             </h:form>  
  25.         </body>  
  26.     </f:view>  
  27. </html>  


1
动作事件
动作事件在组件被激活时由命令按钮触发――按钮,连接等等。正如前面“生命周期事件”所讨论的,动作事件在调用应用程序阶段触发,接近生命周期的末端。

通常将动作监听器连接到JSF页面的命令组件,例如可以将一个动作监听器添加到一个按钮上。如上例中为按钮定义了一个事件:
<h:commandbutton value="Login" action="login" actionlistener="#{user.listen}">

当命令组件被激活时,它们提交请求,因此不需要使用onchange来强迫提交表单,这与值变化事件中所做的有所不同,当激活一个命令或连接时,封闭的表单将被提交,然后JSF实现将触发动作事件。

认识action listener和action之间的区别很重要,动作被设计用于业务逻辑并参与导航处理,而动作监听器通常执行用户页面逻辑,但不参与导航处理。当动作需要用户界面相关的信息时,动作监听器通常与动作一起工作。</h:commandbutton>
分享到:
评论
1 楼 prajuacj 2008-10-10  
请教要是需要在监听器中实现页面错误提示怎么实现?谢谢

相关推荐

    jsf例子\监听器 例子

    监听器可以影响生命周期的进程,例如通过调用`FacesContext.renderResponse()`提前结束当前阶段,或者调用`FacesContext.responseComplete()`立即终止整个生命周期。 4. **事件处理与JSF生命周期的关系**: 在JSF...

    jsf中监听器与转换器的使用

    首先,我们要理解JSF监听器的作用。监听器是在特定事件发生时执行的代码段,例如用户提交表单或者页面导航。通过实现`javax.faces.event.FacesListener`接口或使用预定义的监听器类,开发者可以注册监听器来响应这些...

    JSF的工作方式 JSF架构 JSF模型 JSF事件类型

    在JSF中,事件处理通常通过监听器(Listeners)和处理器(Action Methods)完成,这些可以在管理Bean中定义。监听器用于响应特定类型的事件,而处理器方法则执行与事件相关的操作。 ### JSF配置与导航 为了配置JSF...

    jsf帮助文档 中文手册 javascript js_ref

    6. 事件处理:JSF有丰富的事件处理机制,允许开发者定义事件监听器和处理程序。 三、JavaScript与JSF的结合 1. AJAX集成:通过JavaScript和XMLHttpRequest对象,JSF可以实现部分页面更新,提高用户体验。 2. JSF...

    JSF中文教程jsf

    **事件处理** 在JSF中是通过事件监听器实现的。当用户与组件交互时,会触发特定的事件,相应的监听器方法会被调用,从而执行相应的处理逻辑。 **生命周期** 是JSF处理请求的关键过程,包括初始化、恢复视图、应用...

    JSF调用的JAR包

    在Java世界中,JSF(JavaServer Faces)是一种用于构建用户界面的服务器端技术,它提供了组件模型、事件处理和应用程序生命周期管理等功能。本话题主要关注JSF与一些相关库的整合,特别是通过JAR包的形式来实现。...

    jsf第三讲事件监听

    在JavaScript Server Faces (JSF) 中,事件监听是框架的核心特性之一,它允许开发者处理用户在Web界面中的交互。JSF事件模型基于JavaBeans事件模型,使得组件间能够通过事件进行通信,增强了组件间的协作能力。本...

    JSF生命周期的事件处理

    JSF提供了丰富的验证机制,可以通过内置的验证器或者自定义验证器来进行验证。一旦验证失败,通常会停止进一步的处理,并向用户显示错误消息。 ##### 2.4 更新模型值 在验证成功之后,用户提交的数据会被更新到...

    jsf中文使用教程jsf中文使用教程

    3. **控制器(Controller)**:当用户与页面交互时,JSF会处理这些事件并调用相应的后台方法。这个过程由JSF生命周期管理,包括初始化、应用请求值、处理验证、更新模型值、调用应用逻辑和渲染响应等阶段。 **JSF的...

    JSF中文教程.zip

    在《JSF中文教程》的.chm文件中,读者可以深入学习到这些概念,通过实例和示例代码了解如何在实际项目中应用JSF。该教程将帮助初学者快速上手JSF,同时为有经验的开发者提供参考,提升他们的JSF开发技能。

    第8章 JSF事件处理(熊)课件及示例程序

    3. **事件监听器**:在JSF中,事件监听器通过实现特定接口(如`javax.faces.event.ActionListener`或`javax.faces.event.PhaseListener`)来定义。监听器可以注册到组件、页面或者整个应用程序,以便在事件触发时...

    jsf 中文帮助文档

    例如,JSF中的数据绑定和事件处理机制都与Java的反射和事件监听器机制密切相关。 在JSF中,**组件树** 是一种核心概念,它是页面所有UI组件的逻辑表示。每个组件都有自己的属性和事件,可以通过EL(Expression ...

    JSF帮助文档

    标签“jsf”直接指向JSF技术,意味着文档内容可能涉及JSF的使用、教程、最佳实践或者是解决JSF开发中遇到的问题。由于提供的文件内容主要是邮件头信息和HTML格式的元数据,它们并不直接包含JSF的具体知识点。但是,...

    精通JSF中文教程精通JSF中文教程

    **JSF(JavaServer Faces)** 是一种Java平台上的Web应用程序开发框架,它提供了一种组件化、事件驱动的方式来构建用户界面。本教程旨在帮助读者深入理解和熟练掌握JSF技术,以便于高效地开发企业级的Web应用。 **1...

    JSF入门(一)

    JSF组件有一个明确的生命周期,包括六步:恢复视图、应用请求值、处理验证、更新模型值、调用后处理和渲染响应。在每个阶段,JSF都会执行特定的任务,如解析请求参数、验证用户输入、更新bean的属性等。 **6. ...

    JSF入门(中文pdf)

    在JSF中,UI组件(View)可以直接映射到后端的数据源(Model),并可以通过事件处理(Controller)进行交互。这使得开发者可以更专注于业务逻辑,而无需过多关注底层的HTTP通信细节。 首先,JSF的组件库是其一大...

    JSF中文教程+JSF参数传递方式

    你可以定义一个监听器方法来处理这些事件,参数通常会作为方法的输入。 4. **EL表达式和转换器**:EL表达式可以用来在Bean和组件之间传递复杂的对象。此外,JSF还允许自定义转换器,以确保数据在组件和Bean之间的...

    JSF 简介(英文)

    JSF中的视图由组件树构成,而控制器则通过Action和事件监听器来响应用户操作。这种松耦合的架构使得各部分可以独立工作,提高了系统的可维护性和灵活性。 三、JSF请求/响应生命周期:JSF定义了一个详细的请求/响应...

    jsf教程

    - 事件监听器是响应特定事件的Java方法,通过在组件上注册监听器,开发者可以在事件发生时执行相应的逻辑。 4. **EL(Expression Language)**: - EL是用于访问应用程序上下文中的数据的简洁表达式语言,它可以...

Global site tag (gtag.js) - Google Analytics