Posted on 2007-07-04 11:00
Java.net 閱讀(3170)
評論(9) 編輯 收藏 所屬分類:
JSF
Eclipse3.3剛剛發布,正在學習JSF,于是使用Eclipse3.3做了一個JSF的Demo,很簡單,主要是頁面的跳轉、組件和Bean的綁定等基礎...
1、工具準備: Eclipse3.3 WTP2.0 (最好下載一個all-in-one的版本..省的麻煩)...
依賴包:jsf1.2.04-p02,目前的最新版本.內含:jsf-api.jar;jsf-impl.jar.
jstl.jar;standard.jar;commons-beanutils.jar;commons-collections.jar
commons-digester.jar
Web服務器使用Tomcat6..我用的是6.0.10,目前最近的好像是6.0.13.
2、在Eclipse中新建一個Dynamic Web Project...Project name任意..Target Runtime選擇Apache Tomcat v6.0,下一步可以設置應用的組件,這里把JSF選上.其余默認..
3、完成后,項目的文件結構已經建好,開始編碼:
首先定義一個PersionBean:
1 package com.xzuf.jsf;
2 import java.io.Serializable;
3 /**
4 * PersonBean
5 * @author xzgf <a href='mailto:javac_oracle@163.com'>javac_oracle@163.com</a>
6 * @create 2007-7-2
7 */
8 public class PersonBean implements Serializable {
9 private String name;
10 private String password;
11 /**
12 * @return the password
13 */
14 public String getPassword() {
15 return password;
16 }
17 /**
18 * @param password the password to set
19 */
20 public void setPassword(String password) {
21 this.password = password;
22 }
23 public String getName() {
24 return name;
25 }
26 public void setName(String name) {
27 this.name = name;
28 }
29 }
30
接著在faces-config.xml注冊剛定義的PersonBean,使得可以在應用中直接使用bean的實例.
<managed-bean>
<description>
jsf test bean</description>
<managed-bean-name>
personBean</managed-bean-name>
<managed-bean-class>
com.xzuf.jsf.PersonBean</managed-bean-class>
<managed-bean-scope>
session</managed-bean-scope>
</managed-bean>
接著定義兩個jsp頁面,并增加jsf標簽..完整的代碼請到附件中下載..
firstjsf.jsp
<body>
<center>
<h3>Please enter your user name and password</h3>
<f:view>
<h:form id="myForm">
<h:panelGrid columns="2">
<h:outputText value="User Name:"></h:outputText>
<h:inputText value="#{personBean.name}" required="true"></h:inputText>
<h:outputText value="Password:"></h:outputText>
<h:inputSecret id="userpassword" value="#{personBean.password}" required="true"> </h:inputSecret>
<h:outputText value=""></h:outputText>
<h:commandButton value="Login" action="login"></h:commandButton>
<h:graphicImage id="waveImg" url="/images/wave.med.gif"></h:graphicImage>
<h:message showSummary="true" showDetail="true"
style="color: red; font-family: 'New Century Schoolbook', serif; font-style: oblique"
id="errors1" for="userpassword"/>
</h:panelGrid>
</h:form>
</f:view>
</center>
welcome.jsp
<body>
<f:view>
<h:outputText value="#{personBean.name}"></h:outputText> Hello!!
<br>Your password is :
<h:outputLabel value="#{personBean.password}"></h:outputLabel>
<h3>Welcome to JavaServerFace</h3>
</f:view>
</body>
還是在faces-config.xml.中配置頁面導航,可以通過拖拽設置...
全部保存后,右擊項目,在Debug中選擇Debug on server.....