当前位置: 代码迷 >> JavaScript >> jsf hello world-转
  详细解决方案

jsf hello world-转

热度:847   发布时间:2013-03-25 15:43:04.0
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. ??
  3. public?class?UserBean?{ ??
  4. ????private?String?username; ??
  5. ???? ??
  6. ????public?String?getUsername()?{ ??
  7. ????????return?username; ??
  8. ????} ??
  9. ??
  10. ????public?void?setUsername(String?username)?{ ??
  11. ????????this.username?=?username; ??
  12. ????} ??
  13. }??
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. ??
  3. <faces-config?xmlns="http://java.sun.com/xml/ns/javaee"??
  4. ????xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"??
  5. ????xsi:schemaLocation="http://java.sun.com/xml/ns/javaee?http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd"??
  6. ????version="1.2">? ??
  7. ????<navigation-rule>??
  8. ????????<from-view-id>/index.jsp</from-view-id>??
  9. ????????<navigation-case>??
  10. ????????????<from-outcome>login</from-outcome>??
  11. ????????????<to-view-id>/result.jsp</to-view-id>??
  12. ????????</navigation-case>??
  13. ????</navigation-rule>??
  14. ???? ??
  15. ??????<managed-bean>??
  16. ????????<managed-bean-name>user</managed-bean-name>??
  17. ????????<managed-bean-class>com.wepull.bean.UserBean</managed-bean-class>??
  18. ????????<managed-bean-scope>session</managed-bean-scope>??
  19. ????</managed-bean>??
  20. </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. ???? ??
  8. ????</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. ???? ??
  4. ????</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,要么新建一个工程,或者自己导入相应的包
  相关解决方案