jsf hello world---转

收藏自: http://animalfishyu.iteye.com/blog/501070 首先不说多余的话，直接先上helloworld入门示例，这样最直接的初体验一下JSF

1.可以去JSF官网下载相应的JSF文件，或者使用MyEclipse6.5导入JSF支持，因为在MyEclipse6.5下建立web工程，所建的web工程下Java EE 5 Libraries下包含了jsf-impl.jar和jsf-api.jar，故导入的支持，实际是在 web.xml中对javax.faces.webapp.FacesServlet这个类的一个注册，并且导入一个可以可视化配置的 faces-config.xml配置文件，具体 web.xml中的配置如下

Xml代码

1. <servlet>  
2.   <servlet-name>Faces Servlet</servlet-name>  
3.   <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>  
4.   <load-on-startup>0</load-on-startup>  
5. </servlet>  
6. <servlet-mapping>  
7.   <servlet-name>Faces Servlet</servlet-name>  
8.   <url-pattern>*.faces</url-pattern>  
9. </servlet-mapping>  

<servlet>
    <servlet-name>Faces Servlet</servlet-name>
    <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
    <load-on-startup>0</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>*.faces</url-pattern>
  </servlet-mapping>
      

该配置不需多讲，知道servlet配置的都应该知道其中的含义，这里只对*.faces做个简单的解释，凡是 *.faces的请求，均通过该类处理，Jsf处理的办法是：将直接调用对应的.jsp页面，例如：/index.faces,则实际FacesServlet会去调用对应的/index.jsp页面

2.编写一个简单的javabean

Java代码

1. package com.wepull.bean;   
2. public class UserBean {   
3.     private String username;   
4.     public String getUsername() {   
5.         return username;   
6.     }   
7.     public void setUsername(String username) {   
8.         this.username = username;   
9.     }   
10. }  

package com.wepull.bean;

public class UserBean {
	private String username;
	
	public String getUsername() {
		return username;
	}

	public void setUsername(String username) {
		this.username = username;
	}
}
           

我们将在index.jsp页面提交一个表单，将名字显示在result.jsp页面中

3.在faces-config.xml中进行配置

具体的配置如下:

Xml代码

1. <?xml version='1.0' encoding='UTF-8'?>  
2. <faces-config xmlns="http://java.sun.com/xml/ns/javaee"  
3.     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"  
4.     xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd"  
5.     version="1.2">    
6.     <navigation-rule>  
7.         <from-view-id>/index.jsp</from-view-id>  
8.         <navigation-case>  
9.             <from-outcome>login</from-outcome>  
10.             <to-view-id>/result.jsp</to-view-id>  
11.         </navigation-case>  
12.     </navigation-rule>  
13.       <managed-bean>  
14.         <managed-bean-name>user</managed-bean-name>  
15.         <managed-bean-class>com.wepull.bean.UserBean</managed-bean-class>  
16.         <managed-bean-scope>session</managed-bean-scope>  
17.     </managed-bean>  
18. </faces-config>  

<?xml version='1.0' encoding='UTF-8'?>

<faces-config xmlns="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd"
    version="1.2"> 
    <navigation-rule>
		<from-view-id>/index.jsp</from-view-id>
		<navigation-case>
			<from-outcome>login</from-outcome>
			<to-view-id>/result.jsp</to-view-id>
		</navigation-case>
	</navigation-rule>
	
	  <managed-bean>
		<managed-bean-name>user</managed-bean-name>
		<managed-bean-class>com.wepull.bean.UserBean</managed-bean-class>
		<managed-bean-scope>session</managed-bean-scope>
	</managed-bean>
</faces-config>
      

这里做一个简要的说明:

navigation-rule：是jsf的导航规则：在这段配置代码里面定义了一个规则，from-view-id:指的是请求来自的具体的位置,这里请求是从index.jsp中发出的，navigation-case里面指出了具体的请求，转向到具体的资源，这里login请求会转向到一个result页面

managed-bean:是在配置一个javabean，前面2个子节点不需多解释managed-bean-scope：指定javabean存储的区域

4.编写相应的jsp页面

首先编写index.jsp

首先先导入我需要使用的JSF标签

Html代码

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

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

core标签处理UI组件，html标签是有些最终会转化成相应html控件

接着编写jsp页面

Html代码

1. <f:view>  
2.         <h:form>  
3.             <h3>请输入姓名:</h3>  
4.             名称:<h:inputText value="#{user.username}"></h:inputText>  
5.             <h:commandButton value="送出" action="login"></h:commandButton>  
6.         </h:form>  
7.     </f:view>  

<f:view>
 		<h:form>
 			<h3>请输入姓名:</h3>
 			名称:<h:inputText value="#{user.username}"></h:inputText>
  			<h:commandButton value="送出" action="login"></h:commandButton>
 		</h:form>
 	
 	</f:view>
           

如果需要使用JSF的组件，也就是一系列标签，则需要使用<f:view>标签包含

<h:form>对应一个表单

<h:inputText>产生一个文本框，输入值提交之后将会把值赋给user所对应的属性name

<h:commandButton>产生一个提交按钮，提交的请求时login

再编写result.jsp

同样先导入需要的标签

在编写result.jsp的主要内容

Html代码

1. <f:view>  
2.         <h:outputText value="#{user.username}" />您好   
3.     </f:view>  

<f:view>
   		<h:outputText value="#{user.username}" />您好
   	
   	</f:view>
           

h:outputText 会向页面打印输出对应的值

5.最后发布，启动服务器，在ie中输入

http://localhost:8080/testjsf/index.faces

testjsf对应发布的工程名

注意如果直接进入http://localhost:8080/testjsf/index.jsp页面将报错

再输入值提交，看结果

具体的代码，上传如下：

注意因为我是使用的myeclipse建工程时自带的Java EE 5 Libraries

所以下载运行的时候要么导入Java EE 5 Libraries，要么新建一个工程，或者自己导入相应的包