JSF 搭建第一个JSF

与一般的的MVC框架的配置几乎是一样

 

1. 开发包

* jsf-impl.jar
* jsf-api.jar
* commons-digester.jar
* commons-collections.jar
* commons-beanutils.jar
* jstl.jar
* standard.jar

 

2. web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4"
    xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
    <display-name>JSFFirstDemo</display-name>
    <servlet>
        <servlet-name>JSFFirstDemo</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>JSFFirstDemo</servlet-name>
        <url-pattern>*.faces</url-pattern>
    </servlet-mapping>
    <welcome-file-list>
        <welcome-file>index.faces</welcome-file>
        <welcome-file>index.jsp</welcome-file>
    </welcome-file-list>
</web-app>

 

3. 独特的配置xml文件, 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/login.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>
            com.jxhuang.firstJSF.jsfbean.User
        </managed-bean-class>
        <managed-bean-scope>session</managed-bean-scope>
    </managed-bean>
</faces-config>

 

4. 页面 login.jsp -> welcome.jsp

/pages/welcome.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<f:view>
    <h3><font color="red"><h:outputText value="#{user.name}" />
    ! </font>Welcome to login!!!!!!!</h3>

</f:view>

</body>
</html>

 

/pages/login.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
    <f:view>
        <h:form>
            <h3>Welcome to our System!</h3>
            <h:inputText value="#{user.name}"/><br>
            <h:inputSecret value="#{user.password}"/><br>
            <h:commandButton value="Login" action="login"></h:commandButton>
        </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页面。

 

5. Bean

public class User{

    private String name;

    private String password;

    //setter and getter

}

 

6. 访问路径

值得关注的是,当要访问含有jsf标签页面的时候,应该访问路径应该是

域名:端口/项目名/页面名.faces

而不能直接访问该jsp页面,即 域名:端口/项目名/页面名.jsp




你可能感兴趣的:(html,JSF,action,login,getter,encoding)