级别： 初级

周 进光 (zhoujinguang@yahoo.com.cn), 软件工程师, 舜联软件科技

2007 年 11 月 30 日

本文简要介绍如何运用 Richfaces/A4J 来构建 JSF 应用，包括如何定义配置文件、控件使用等。

Ajax4jsf CDK起步，创建一个outputBlock 组件

该教程告诉你如何使用 Ajax4jsf CDK来创建一个简单的组件

作为示例，我们创建一个outputBlock组件（用一个div tag来包含文本内容）,开发者可以通过value属性来定义其中的文本内容，样式属性（style attribute）和时间驱动的onXXX方法都和标准的JSF属性一样工作。

Step 1. Configuration. Creating Library

配置Maven，并创建一个组件库，参考 : http://hi.baidu.c

配置环境

安装Maven，如何配置Maven请参考：http://hi.baidu.com/jsfcn/blog/item/207b0146a6292a0b6b63e58d.html

项目结构

环境设置了使用CDK来开发. 让我们来创建一个小组件（dummy component）来测试一下CDK是否能正常工作。我们现创建一个项目，同时在这个项目中有个组件库，在组件库中还有个组件。最后我们将建构组件库。

建立项目

• 创建一个新的目录

要使用Maven来管理AJAX4JSF程序的开发，要首先配置起资源库（repository），下面来看看如何配置吧：

1. 首先你应该安装好了Maven。要安装Maven请按照如下步骤:

* 打开 http://maven.apache.org/download.html 页面
* 下载 2.0.6 版本，并安装到你的电脑上面
* 把Maven的bin目录添加到环境变量 PATH中

在命令行中输入 mvn -version ，如果显示了Maven的版本信息，则说明你已经安装好了。

2. 在你刚才安装Maven的目录下面，找到一个conf目录下面的settings.xml的文件，打开并

2007.04.13   来自：IT168　   董博生

　　 在服务器端Java（ServerSide Java）研讨会3月22日的一次会议上，SUN公司的高级工程师Ed Burns说：开发人员可以使用JSF开发出企业级的AJAX应用程序，这些应用经过了充分的行业证明，具有良好的健壮性，可靠性，易用性和伸缩性。

　　 Ed Burn还表示：“可以通过不同的方式来使用JSF

使用ajax4jsf在JSF复杂组件(Table)中实现ajax更新功能
不使用InvokeOnComponent,在Iterable JSF组件中实现局部更新,
新的Ajax Listener 添加到发布包中,来实现复杂组件的局部更新. 如果你想在JSF DataTable(or Facelets ui:repeat) 中添加ajax功能,你现在只需要在 a4j:support or a4j:button/link 组件中添加一个ajax listener <a4j:ajaxListener type="org.ajax4jsf.ajax.forceRender"> 就可以了.
使用该方式,我们就不用使用 InvokeOnComponent , 并且与jsf 1.1 程序兼容.
Example:


以下是代码:

<h:dataTable value="#{pictures.al}" var="pics">

<f:facet name="header">

<f:verbatim>Data table with Pictures and Zoom Elements</f:verbatim>

</f:facet>

<h:column>

<h:panelGroup id="rerenderpic">

      

JS Events on sending Ajax requests in Ajax4Jsf

To check Ajax request sending conditions one may use standard <h:form> "onsubmit" attribute.

In addition in ajax4jsf the "onsubmit" attribute was added to <a4j:support> component. It allows to add some checks for requests sending.

Example (XHTML Page):
<a4j:outputPanel id="panel">
<h:form>
<h:selectOneMenu value="#{bean.text}">
<f:selectItem itemValue="The First Item Choosen" itemLabel="First Item"/>
<f:selectItem itemValue="The Second Item Choosen" itemLabel="Second Item"/>
<f:selectItem itemValue="The Third Item Choosen" itemLabel="Third Item"/>
<a4j:support event="onchange" reRender="panel"
onsubmit="if(!confir

前几天 在这里https://bpcatalog.dev.java.net/nonav/ajax/textfield-jsf/design.html 看到了一个实现AJAX支持的自动填充表单, 使用这种方式可以改善用户体验, 举个例子: 在填写用户信息的时候 要填写用户的籍贯, 在全国有这么省市和地区,要是仅仅提供一个下拉菜单来选择, 在这么多选项中选择是否很郁闷呢, 如果也可以让用户输入一部分文字 然后弹出相关的选项这样不是更好吗,用户使用更方便.

上面的文章介绍的比较详细, 也是jsf的一个ajax扩展项目, 其实对于使用myfaces的用户来说还有个更的选择:使用 MyFaces Sandbox 中的 InputSuggestAjax   

http://myfaces.apache.org/sandbox/inputSuggestAjax.html 

用法如下:

1.创建一个managed bean:

package test;

import java.util.ArrayList;

import java.util.List;

public class Bean {