JBossTools实践系列：JSF应用开发入门

2008年5月26日 | 01:49分类：JBossTools | 标签：JBossTools jsf tutorial | 浏览：851

转载文章请注明：转载自JBossWeek.com [http://www.jbossweek.com]

开发环境：JBoss AS 4.2.2GA + JBossTools 2.0.1GA

1. 新建JSF项目

1.1. 在JBossTools中选择菜单“New->Project…”，在出现的对话框中选择“JBoss Tools Web->JSF->JSF Project”；

1.2. 在出现的“Create JSF Project”对话框中输入如下信息：

Project Name：HelloJSF

JSF Enviroment*：JSF 1.2

Template*：JSFBlankWithoutLibs

1.3. 选择“Finish”结束创建JSF项目。

2. 添加页面导航

2.1. 在JBoolsTools中选择“HelloJSF”项目，打开“WebContent->WEB-INF”目录下的faces-config.xml文件。在faces-config.xml文件Diagram视图中的任何地方右键单击，选择上下文菜单中的“New View…”。在出现的对话框中输入如下信息：

Form-View-Id：pages/inputname

Template：JSFBasePage

选择“Finish”结束创建名为inputname的View；

2.2. 按照上面的步骤再创建Form-View-Id为pages/hello的View。

2.3. 在两个View之间添加一条从inputname到hello的connection，最终的页面导航结构如下：

3. 添加Managed Bean

3.1. 在JBossTools中选择faces-config.xml的Tree视图，选择“Managed Beans”，在“Managed Beans”选择“Add”，在出现的对话框中输入如下信息：

Scope：request

Class*：demo.PersonBean

Name*：personBean

Generate Source Code：钩选

选择“Finish”结束创建PersonBean。

3.2. 在“Properties”选择“Add”，在出现的对话框中输入如下信息：

Property-Name*：name

PropertyClass：

Value Kind：value

Value：

选择“Finish”结束Property的添加操作。

4. 编辑页面

4.1. 在inputname.jsp和hello.jsp页面代码的<html>标记之前增加：

<%@ page contentType=”text/html,charset=utf-8″ pageEncoding=”utf-8″ %>

将页面的字符集设置为utf-8；

4.2. 打开inputname.jsp，在右侧的“JBoss Tools Palette”中选择“JSF HTML”添加如下控件：

Form：id=personForm

InputText：value=personBean.name,id=name

commandButton：action=hello,value=欢迎

最终的inputname.jsp的代码和预览效果如下：

4.3. 打开hello.jsp，在右侧的“JBoss Tools Palette”中选择“JSF HTML”添加如下控件：

OutputText：value=personBean.name

最终的hello.jsp的代码和预览效果如下：

5. 测试

5.1. 在JBossTools中的Server视图里，启动JBoss服务器；

5.2. 打开浏览器输入http://localhost:8080/HelloJSF/pages/inputname.jsf；

5.3. 在输入框中输入“jbossweek.com网站”，点击“欢迎”按钮，在浏览器中出现如下提示：欢迎您使用JSF：jbossweek.com网站；恭喜您，第一个JSF应用完成了。

JBossWeek