A4J标签、特性与概念详解

### A4J 标签、特性与概念详解 #### 1. 使用 <a4j:region> 简化操作 在某些场景下，使用 `<a4j:region>` 是一种有效的方式。为了让示例代码正常工作，我们只需将输入组件和按钮包裹在 `<a4j:region>` 内，示例代码如下： ```xml <h:form> <a4j:region> <h:panelGrid> … <h:commandButton value="Buy Flowers!"> <a4j:ajax event="click" /> </h:commandButton> </h:panelGrid> </a4j:region> <a4j:outputPanel ajaxRendered="true"> <h:panelGrid> <h:outputText value="#{flowerRegionBean.type}" /> <h:outputText value="#{flowerRegionBean.size}" /> <h:outputText value="#{flowerRegionBean.vase}" /> </h:panelGrid> </a4j:outputPanel> </h:form> ``` 这种方式更加声明式，无需指定要执行的 ID。区域内的任何 Ajax 请求以及区域内的所有输入组件都会被执行（除非其他 Ajax 组件或行为明确指定要执行的组件，此时它们将覆盖该区域）。使用区域时，还可以使用 `@region` 关键字，示例如下： ```xml <a4j:ajax event="click" execute="@region"/> ``` 这表示执行区域内的所有内容，是可选的。即使不指定 `@region`，区域也会默认执行。 #### 2. 验证时跳过模型更新 仅当用户切换焦点或点击其他地方时验证输入字段是一种流行的技术，使用 Ajax 的 `blur` 事件可以轻松实现。示例代码如下： ```xml <h:form> <h:panelGrid columns="3"> <h:outputText value="Name:" /> <h:inputText id="name" value="#{bypassUpdatesBean.name}" > <a4j:ajax event="blur" render="nameMessage"/> </h:inputText> <h:message for="name" id="nameMessage"/> <h:outputText value="Email:" /> <h:inputText id="email" value="#{bypassUpdatesBean.email}" > <a4j:ajax event="blur" render="emailMessage" /> </h:inputText> <h:message for="email" id="emailMessage"/> <h:outputText value="Age:" /> <h:inputText id="age" value="#{bypassUpdatesBean.age}" > <a4j:ajax event="blur" render="ageMessage" /> </h:inputText> <h:message for="age" id="ageMessage"/> </h:panelGrid> <h:commandButton value="Submit" action="page2"/> </h:form> ``` 每个输入字段都为其 `blur` 事件附加了 Ajax 行为。输入完成后，用户点击其他地方或切换焦点时，将发送 Ajax 请求。验证约束使用 Bean 验证注解在托管 Bean 中定义，示例代码如下： ```java @ManagedBean @RequestScoped public class BypassUpdatesBean { @Length (min=3, message="Name must be at least {min} characters long") private String name; @Email(message="Invalid email address") private String email; @Min(value=1, message="Age must be greater than 0") private Integer age; // Getters and setters } ``` 当 `blur` 事件发生时，会向服务器发送 Ajax 请求并验证组件数据。发送此请求时经过的阶段如下： - Restore View - Apply Request Values - Process Validations - Update Model Values - Invoke Application - Render Response 仅进行验证时，是否真的需要经过 `Update Model` 和 `Invoke Application` 阶段呢？答案是否定的。不调用任何操作，点击提交按钮时，才会按预期经过所有阶段。因此，验证时只需到达 `Process Validations` 阶段，然后可以安全地跳转到 `Render Response` 阶段。如果验证失败，无论如何都会进入 `Render Response` 阶段；即使值有效，也希望进入该阶段。 查看 JSF 页面代码会发现，每个 `<a4j:ajax>` 都有一个额外的属性 `bypassUpdates="true"`，示例代码如下： ```xml <h:form> <h:panelGrid columns="3"> <h:outputText value="Name:" /> <h:inputText id="name" value="#{bypassUpdatesBean.name}" > <a4j:ajax event="blur" render="nameMessage" bypassUpdates="true"/> </h:inputText> <h:message for="name" id="nameMessage"/> <h:outputText value="Email:" /> <h:inputText id="email" value="#{bypassUpdatesBean.email}" > <a4j:ajax event="blur" render="emailMessage" bypassUpdates="true"/> </h:inputText> <h:message for="email" id="emailMessage"/> <h:outputText value="Age:" /> <h:inputText id="age" value="#{bypassUpdatesBean.age}" > <a4j:ajax event="blur" render="ageMessage" bypassUpdates="true"/> </h:inputText> <h:message for="age" id="ageMessage"/> </h:panelGrid> <h:commandButton value="Submit" action="page2"/> </h:form> ``` 该属性正是我们所需要的，它会使我们进入 `Process Validations` 阶段，然后即使值有效也会跳转到 `Render Response` 阶段。将经过以下阶段： - Restore View - Apply Request Values - Process Validations - Render Response **提示**：使用 `bypassUpdates` 优化表单验证期间的 JSF 生命周期。 #### 3. 创建阶段跟踪器 简单阶段跟踪器的示例代码如下： ```java package org.richfaces.book.utils.PhaseTracker public class PhaseTracker implements javax.faces.event.PhaseListener{ public void afterPhase(PhaseEvent e) { e.getFacesContext().getExternalContext().log("after "+e.getPhaseId()); } public void beforePhase(PhaseEvent e) { e ```