JSF入门三(第一个JSF程序)
2013-04-14 22:11
288 查看
本文参考并转载:
http://www.javaworld.com.tw/confluence/pages/viewpage.action?pageId=2630
本人使用的JSF实现是mojarra-2.0.3-FCS,下载地址:http://javaserverfaces.java.net/download.html
我们将设计一个简单的登入程序,使用者提交名称,之后由程序显示使用者名称及欢迎信息。
一、导入jar包(jsf-impl.jar jsf-api.jar jstl.jar standard.jar)
解压mojarra-2.0.3-FCS-source.zip,将lib目录下面jsf-impl.jar jsf-api.jar取出放入Eclipse的/WEB-INF/lib,另外还需要自己另外下jstl.jar standard.jar,同样也放入Eclipse的/WEB-INF/lib
二、配置web.xml
在上面的定义中,我们将所有.faces的请求交由FaceServlet来处理,FaceServlet会唤起相对的.jsp网页,例如请求是/index.faces的话,则实际上会唤起/index.jsp网页,完成以上的配置,您就可以开始使用JSF了。
三、编写一个简单的java bean
四、设计页面流程
我们将先显示一个登入网页/pages/index.jsp,使用者填入名称并提交表单,之后在/pages/welcome.jsp中显示Bean中的使用者名称与欢迎信息。
1.index.jsp
我们使用了JSF的core与html标签库,core是有关于UI组件的处理,而html则是有关于HTML的进阶标签。
<f:view>与<html>有类似的作用,当您要开始使用JSF组件时,这些组件一定要在<f: view>与</f:view>之间,就如同使用HTML时,所有的标签一定要在<html>与< /html>之间。
html标签库中几乎都是与HTML标签相关的进阶标签,<h:form>会产生一个表单,我们使用<h: inputText>来显示user这个Bean对象的name属性,而<h:commandButton>会产生一个提交按钮,我们在action属性中指定将根据之前定义的login页面流程中前往welcome.jsp页面。
网页设计人员不必理会表单传送之后要作些什么,他只要设计好欢迎页面就好了:
2.welcome.jsp
五、为了让JSF知道我们所设计的Bean以及页面流程,我们定义一个/WEB-INF/faces-config.xml:
在<navigation-rule>中,我们定义了页面流程,当请求来自<from-view- id>中指定的页面,并且指定了<navigation-case>中的<from-outcome>为login时,则会将请求导向至<to-view-id>所指定的页面。
在<managed-bean>中我们可以统一管理我们的Bean,我们设定Bean对象的存活范围是session,也就是使用者开启浏览器与程序互动过程中都存活。
六、接下来启动Container,连接上您的应用程序网址,例如:http://localhost:8080/jsfDemo/pages/index.faces,填入名称并提交表单,您的欢迎页面就会显示了。
http://www.javaworld.com.tw/confluence/pages/viewpage.action?pageId=2630
本人使用的JSF实现是mojarra-2.0.3-FCS,下载地址:http://javaserverfaces.java.net/download.html
我们将设计一个简单的登入程序,使用者提交名称,之后由程序显示使用者名称及欢迎信息。
一、导入jar包(jsf-impl.jar jsf-api.jar jstl.jar standard.jar)
解压mojarra-2.0.3-FCS-source.zip,将lib目录下面jsf-impl.jar jsf-api.jar取出放入Eclipse的/WEB-INF/lib,另外还需要自己另外下jstl.jar standard.jar,同样也放入Eclipse的/WEB-INF/lib
二、配置web.xml
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5"> <description> JSF Demo </description> <display-name>JSF Demo</display-name> <servlet> <servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*.faces</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>index.html</welcome-file> </welcome-file-list> </web-app>
在上面的定义中,我们将所有.faces的请求交由FaceServlet来处理,FaceServlet会唤起相对的.jsp网页,例如请求是/index.faces的话,则实际上会唤起/index.jsp网页,完成以上的配置,您就可以开始使用JSF了。
三、编写一个简单的java bean
package bruce.zhao.model; public class UserBean { private String name; public void setName(String name) { this.name = name; } public String getName() { return name; } }
四、设计页面流程
我们将先显示一个登入网页/pages/index.jsp,使用者填入名称并提交表单,之后在/pages/welcome.jsp中显示Bean中的使用者名称与欢迎信息。
1.index.jsp
<%@taglib uri="http://java.sun.com/jsf/core" prefix="f"%> <%@taglib uri="http://java.sun.com/jsf/html" prefix="h"%> <%@page contentType="text/html;charset=GB2312"%> <html> <head> <title>第一个JSF程序</title> </head> <body> <f:view> <h:form> <h3>请输入您的名称</h3> 名称: <h:inputText value="#{user.name}" /> <p><h:commandButton value="送出" action="login" /> </h:form> </f:view> </body> </html>
我们使用了JSF的core与html标签库,core是有关于UI组件的处理,而html则是有关于HTML的进阶标签。
<f:view>与<html>有类似的作用,当您要开始使用JSF组件时,这些组件一定要在<f: view>与</f:view>之间,就如同使用HTML时,所有的标签一定要在<html>与< /html>之间。
html标签库中几乎都是与HTML标签相关的进阶标签,<h:form>会产生一个表单,我们使用<h: inputText>来显示user这个Bean对象的name属性,而<h:commandButton>会产生一个提交按钮,我们在action属性中指定将根据之前定义的login页面流程中前往welcome.jsp页面。
网页设计人员不必理会表单传送之后要作些什么,他只要设计好欢迎页面就好了:
2.welcome.jsp
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%> <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%> <%@page contentType="text/html;charset=GB2312"%> <html> <head> <title>第一个JSF程序</title> </head> <body> <f:view> <h:outputText value="#{user.name}" /> 您好! <h3>欢迎使用 JavaServer Faces!</h3> </f:view> </body> </html>
五、为了让JSF知道我们所设计的Bean以及页面流程,我们定义一个/WEB-INF/faces-config.xml:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE faces-config PUBLIC "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.0//EN" "http://java.sun.com/dtd/web-facesconfig_1_0.dtd"> <faces-config> <navigation-rule> <from-view-id>/pages/index.jsp</from-view-id> <navigation-case> <from-outcome>login</from-outcome> <to-view-id>/pages/welcome.jsp</to-view-id> </navigation-case> </navigation-rule> <managed-bean> <managed-bean-name>user</managed-bean-name> <managed-bean-class> bruce.zhao.model.UserBean </managed-bean-class> <managed-bean-scope>session</managed-bean-scope> </managed-bean> </faces-config>
在<navigation-rule>中,我们定义了页面流程,当请求来自<from-view- id>中指定的页面,并且指定了<navigation-case>中的<from-outcome>为login时,则会将请求导向至<to-view-id>所指定的页面。
在<managed-bean>中我们可以统一管理我们的Bean,我们设定Bean对象的存活范围是session,也就是使用者开启浏览器与程序互动过程中都存活。
六、接下来启动Container,连接上您的应用程序网址,例如:http://localhost:8080/jsfDemo/pages/index.faces,填入名称并提交表单,您的欢迎页面就会显示了。
相关文章推荐
- Android开发初级入门:我的第一个Android 程序
- Android开发入门之第一个android程序
- [原]VS2012入门图文教程——第一个程序Hello World
- Spring MVC优势和第一个入门程序
- Python学习入门和第一个python程序的运行
- Windows Azure入门教学系列 (二):部署第一个Web Role程序
- GPU 编程入门到精通(三)之 第一个 GPU 程序
- Hadoop大数据平台入门——第一个小程序WordCount
- Android入门(4) 开发第一个Android程序
- Android 入门环境搭建第一个helloWord程序
- 《Go语言入门》第一个Go语言程序——HelloWorld 标签: go语言helloworld 2015-11-29 18:46 4066人阅读 评论(4) 收藏 举报 分类: go语言入门(3)
- JavaSE第一讲:JavaSE入门、JDK的下载与安装、第一个Java程序、Java程序的编译与执行
- JavaSE第一讲:JavaSE入门、JDK的下载与安装、第一个Java程序、Java程序的编译与执行
- nodeJs入门---第一个程序
- 第一个程序 - 零基础入门学习Delphi01
- 第一个程序03 - 零基础入门学习汇编语言22
- Java入门(JDK的安装、环境变量的配置、第一个Java程序)
- python入门(4)第一个python程序
- SSIS实践入门1:我的第一个SSIS程序开发
- Android开发初级入门:我的第一个Android 程序