?????? 最近工作比較閑，開始學習JSF開發，在JSF項目中，首先客戶端觸發相關的事件，發送請求到服務端的執行JSF的控制器類FacesServlet中，通過這個類執行服務類相關的方法的，服務類相關的方法調用相關的模型信息，將結果給客戶端。下面簡介開發一個簡單的JSF 實例過程如下：
?
1.創建一個Web項目：
??????? 導入JSF相關的類庫如下：
項目結構如下：
2.在faces-config.xml配置信息如下：
<?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">
<!--
國際化配置
在<local-config>一定有一個<default-locale>，而<supported-locale>可以有好幾個，這告訴JSF您的應用程式支援哪些語系。
-->
<!--
<f:view>可以設定locale屬性，直接指定所要使用的語系
加載國家化的方法
JSF會根據<f:loadBundle>的basename屬性加上<f:view>的locale屬性來決定要使用哪一個訊息資源檔
-->
<application>
<locale-config>
<default-locale>en_US</default-locale>
<supported-locale>zh_CN</supported-locale>
</locale-config>
<message-bundle>
messages
</message-bundle>
</application>
<!-- JSF 校驗器的配置 -->
<validator>
<validator-id>com.easyway.jsf.email</validator-id>
<validator-class>com.easyway.jsf.commons.EmailValidator</validator-class>
</validator>
<!-- 容器管理bean的配置 -->
<managed-bean>
<managed-bean-name>mathService</managed-bean-name>
<managed-bean-class>com.easyway.jsf.service.MathService</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
<!-- 容器導航的規則 -->
<navigation-rule>
<from-view-id>/index.jsp</from-view-id>
<navigation-case>
<from-outcome>result</from-outcome>
<to-view-id>./result.jsp</to-view-id>
</navigation-case>
</navigation-rule>
</faces-config>
?
3.服務類中各種信息如下：
package com.easyway.jsf.service;
/***
* JSF后臺的服務的
* @author longgangbai
*
*/
public class MathService {
private int num0;
private int num1;
private int result;
private String email;
private String password;
public int getNum0() {
return num0;
}
public void setNum0(int num0) {
this.num0 = num0;
}
public int getNum1() {
return num1;
}
public void setNum1(int num1) {
this.num1 = num1;
}
public int getResult() {
return num0+num1;
}
public void setResult(int result) {
this.result = result;
}
public String getEmail() {
return email;
}
public void setEmail(String email) {
this.email = email;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public int sum(){
return num0+num1;
}
/**
* 直面執行的方法
*
* @return
*/
public String resultSum(){
result =sum();
return "result";
}
}
?
4.在Web.xml配置如下：
?
???
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="2.5" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<context-param>
<param-name>javax.faces.CONFIG_FILES</param-name>
<param-value>/WEB-INF/faces-config.xml</param-value>
</context-param>
<servlet>
<servlet-name>FacesServlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>0</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>FacesServlet</servlet-name>
<url-pattern>*.faces</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
?頁面如下：
index.jsp:
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="/WEB-INF/taglib.tld" prefix="co" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSF 'MyJsp.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
<f:view locale="en_US">
<f:loadBundle basename="messages" var="msgs"/>
<h:form>
<h:panelGrid columns="3">
<h:outputLabel value="#{msgs.math_num0}"></h:outputLabel>
<h:inputText id="num0" value="#{mathService.num0}" ></h:inputText>
<h:message for="num0" ></h:message>
<h:outputLabel value="#{msgs.math_num1}"></h:outputLabel>
<h:inputText id="num1" value="#{mathService.num1}" ></h:inputText>
<h:message for="num1" ></h:message>
<!-- 校驗器的使用 -->
<h:outputLabel value="電子郵件："></h:outputLabel>
<h:inputSecret id="email" value="#{mathService.email}" required="true">
<f:validator validatorId="com.easyway.jsf.email" />
<f:attribute name="mymsg" value="電子郵件長度必須大于5個字符"/>
<f:attribute name="emailpattern" value="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" />
</h:inputSecret>
<h:message for="email" ></h:message>
<!-- 自定義標簽的校驗器的使用 -->
<h:outputLabel value="用戶賬號"></h:outputLabel>
<h:inputSecret id="password" value="#{mathService.password}" required="true">
<co:EmailValidator pattern=".+[0-9]+"/>
</h:inputSecret>
<h:message for="password" ></h:message>
<h:commandButton value="#{msgs.math_result}" action="#{mathService.resultSum}"></h:commandButton>
</h:panelGrid>
</h:form>
</f:view>
</body>
</html>
?
result.jsp:
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSF 'result.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
<f:view>
<h:outputText value="#{mathService.num0}"/>
和
<h:outputText value="#{mathService.num1}"/>
結算結果：
<h:outputText value="#{mathService.result}"/>
</f:view>
</body>
</html>
?運行：
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號聯系： 360901061
您的支持是博主寫作最大的動力，如果您喜歡我的文章，感覺我的文章對您有幫助，請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點擊下面給點支持吧，站長非常感激您！手機微信長按不能支付解決辦法：請將微信支付二維碼保存到相冊，切換到微信，然后點擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對您有幫助就好】元
