JSF技术研究——第一个JSF程序

1． 首先从 SUN 网站下载 JSF1.1 ： http://java.sun.com/javaee/javaserverfaces/download.html 。由于 1.2 的支持情况还不完善，建议使用 1.1 。
2． 用 eclipse 建立一个 web 项目，把下载的 ZIP 文件中的 LIB 中的 JAR 包复制到， WEB 项目的 LIB 下。
3． 在 WEB-INF 在建立两个文件，一个是 web.xml 用于配置 web 应用，另一个是 faces-config.xml 用于配置 jsf 的信息。首先建立 WEB-INF 下的 web.xml 文件，主要是配置 jsf 的 servlet ，不详细说明了。

1

<? xml version="1.0" encoding="ISO-8859-1" ?>
2


3

< web-app xmlns ="http://java.sun.com/xml/ns/j2ee"
4

xmlns:xsi ="http://www.w3.org/2001/XMLSchema-instance"
5

xsi:schemaLocation ="http://java.sun.com/xml/ns/j2ee
6
http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd" 7

version ="2.4" >
8


9

< description >
10

JSF Demo
11

</ description >
12

< display-name > JSF Demo </ display-name >
13

< servlet >
14

< servlet-name > Faces Servlet </ servlet-name >
15

< servlet-class >
16

javax.faces.webapp.FacesServlet
17

</ servlet-class >
18

< load-on-startup > 1 </ load-on-startup >
19

</ servlet >
20


21

< servlet-mapping >
22

< servlet-name > Faces Servlet </ servlet-name >
23

< url-pattern > *.faces </ url-pattern >
24

</ servlet-mapping >
25


26

< welcome-file-list >
27

< welcome-file > index.jsp </ welcome-file >
28

</ welcome-file-list >
29

</ web-app >
30


4．编写一个JavaBean，也就是一个managed-bean，它是JSF吹棒自己的一个优势：POJO对象，负责处理后台业务：

1

package jsf.bean;
2


3



public class UserBean

{
4

private String name;
5


6



public void setName(String name)

{
7

this .name = name;
8

}
9


10



public String getName()

{
11

return name;
12

}
13

}
14


4． 编写JSF的配置文件faces-config.xml，这个配置了一个导航规则navigation-rule，和一个managed-bean：

1

<? xml version="1.0" ?>
2

<! DOCTYPE faces-config PUBLIC
3

"-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.0//EN"
4

"http://java.sun.com/dtd/web-facesconfig_1_0.dtd" >
5


6

< faces-config >
7

< navigation-rule > <! —- 导航规则-- >
8

< from-view-id > /index.jsp </ from-view-id > <! —- 限定于此页的规则-- >
9

< navigation-case >
10

< from-outcome > welcome </ from-outcome > <! —- action中使用的导航名称-- >
11

< to-view-id > /welcome.jsp </ to-view-id > <! —-要跳转到的目标-- >
12

</ navigation-case >
13

</ navigation-rule >
14


15

< managed-bean >
16

< managed-bean-name > user </ managed-bean-name > <! —- bean的名称-- >
17

< managed-bean-class > <! —- bean 的类名-- >
18

jsf.bean.UserBean
19

</ managed-bean-class >
20

< managed-bean-scope > session </ managed-bean-scope > <! —- bean的生命周期-- >
21

</ managed-bean >
22

</ faces-config >
23


24


5． 编写index.jsp文件，里面有一个输入框，输入你的名称，点击提交，就跳转到welcome.jsp页面了。

1

<!-- 引入JSF核心库 -->
2



<%

@taglib uri = " http://java.sun.com/jsf/core " prefix = " f " %>
3

<!-- 引入JSF html库 -->
4



<%

@taglib uri = " http://java.sun.com/jsf/html " prefix = " h " %>
5



<%

@page contentType = " text/html;charset=Big5 " %>
6

< html >
7

< head >
8

< title > 第一个JSF程序 </ title >
9

</ head >
10

< body >
11

< f:view > <! —- 表明下面是JSF渲染的内容 -- >
12

< h:form > <! —- html库中的form , inputText,commandButton标签，相当于html标准中的<form > < input type =”text” >< button > -->
13

< h3 > 您的名称： </ h3 >
14

<! —- 将输入的值保存到user bean的name属性 -- >
15

< h:inputText value ="#{user.name}" />< p >
16

< h:commandButton value ="提交" action ="welcome" />
17

<!-- 这里的 action=”welcome” 就是上面faces-config.xml中配置的navigation-rule，当点击提交时，就会跳转到welcome.jsp -->
18

</ h:form >
19

</ f:view >
20

</ body >
21

</ html >
22


6． 编写welcome.jsp文件，用于显示一个欢迎提示信息。

1



<%

@ taglib uri = " http://java.sun.com/jsf/core " prefix = " f " %>
2



<%

@ taglib uri = " http://java.sun.com/jsf/html " prefix = " h " %>
3



<%

@page contentType = " text/html;charset=Big5 " %>
4

< html >
5

< head >
6

< title > 第一个JSF程序 </ title >
7

</ head >
8

< body >
9

< f:view >
10

<! —- 显示 user bean的 name属性 -- >
11

< h:outputText value ="#{user.name}" /> 您好！
12

< h3 > 欢迎进入JSF的世界 </ h3 >
13

</ f:view >
14

</ body >
15

</ html >
16


7． 把本项目（jsfdemo）部署到Tomcat5下，打开浏览器输入 http://localhost:8080/jsfdemo