JSF技術為開發(fā)基于網(wǎng)絡用戶界面的Java開發(fā)者提供了標準的編程接口API以及標記庫。Apache Struts框架的作者Craig McClanahan，協(xié)助領導了Sun公司的JSF項目。這使項目能夠容易的從流行的Apache向JSF標準移植得到了保證。就像Struts框架一樣，JSF定義了一套JSP標記，能夠生成與JavaBean屬性綁定在一起的HTML表單元素。

本系列第一篇：JAVA教程之JSF開發(fā)(一)

用戶界面組件與驗證

文件edit.jsp中的<h:form>元素包含多個用戶界面組件，我們將會在后面詳細地介紹。各組件的HTML代碼都是由JSF組件標記產生，例如：<h:input_textarea>，該標記中可能還會包含其他JSF標記，如：<f:validate_required>標記，該標記使JSF確認用戶輸入了信息。

處理用戶輸入的組件使用屬性valueRef="pbean.property"與JavaBean屬性綁定起來。JSF獲得和設置管理bean屬性值已在前面介紹了。

有的JSF組件標記不會處理任何用戶輸入。例如<h:output_text>可用于輸出文本或JavaBean只讀屬性的值。

每個組件都有唯一的ID，ID可在id屬性中指定或由JSF自動生成。要進行驗證的用戶界面組件需要id屬性以便驗證錯誤能夠與<h:output_errors for="id"/>一起顯示打印出來。

圖2：驗證錯誤

文本域Text Area

JSF表單的文本域讓用戶輸入將會由Pbuilder.java生成并由view.jsp顯示的某些文字段落等內容。edit.jsp顯示一個由<h:output_text>確定的標簽并使用<h:input_textarea>生成3行30列的<textarea>HTML元素。<f:validate_required>標記注冊一個JSF驗證器，如果用戶在文本域中的輸入為空則發(fā)出錯誤信號。

錯誤信息將顯示在<h:output_errors>標記的位置，除了顯示錯誤外該標記不會做其他任何操作。<h:output_errors>標記的for屬性值與<h:input_textarea>的id屬性值相同。

<f:use_faces> 
<h:form formName="pform"> 
<p><h:output_text value="Text:"/><br> 
<h:input_textarea id="text" valueRef="pbean.text" 
rows="3" cols="30"> 
<f:validate_required/> 
</h:input_textarea> 
<br><h:output_errors for="text"/> 
..........  
</h:form> 
</f:use_faces> 
 

上面的JSP代碼生成下面的HTML片斷：

<form method="post" action="/usingjsf/faces/edit.jsp"> 
<p>Text:<br> 
<textarea name="text"   
cols="30" rows="3">JavaServer Faces</textarea> 
<br> 
..........  
</form> 

<h:input_textarea>的屬性valueRef="pbean.text"使JSF查找ID為pbean的JavaBean實例，并且將用戶輸入的文本存儲到JavaBean實例的text屬性中。當HTML的表單被生成后，JSF會將text屬性值插入到<textarea>HTML元素中。類Pbean實現(xiàn)了get和set方法可讓JSF獲得或修改屬性的值：

public class PBean implements java.io.Serializable {  
private String text;  
public String getText() {  
return text;  
}  
public void setText(String text) {  
this.text = text;  
}  
..........  
} 

除了<h:input_textarea>，JSF還提供了許多生成單行文本域（text field）的標記：

<intput_text>  
<h:input_number>  
<input_secret>（密碼輸入）  
<input_date>  
<input_datetime>  
<input_time>  
<input_hidden>可被用于隱藏的表單域 

#p#

單行文本域（Text Field）

edit.jsp文件的單行文本域組件只允許輸入1至7之間的數(shù)字。由<h:input_number>生成這段HTML代碼，該標記包含兩個驗證器。<f:validate_required>標記在前面已經(jīng)介紹了。<f:validate_longrange>標記是使驗證器確認用戶輸入的數(shù)字在給定的范圍之內。如果超出范圍，則向用戶報告驗證錯誤，錯誤信息由<h:output_errors>產生。

[code]<f:use_faces> 
<h:form formName="pform"> 
..........  
<p><h:output_text value="Size: [1-7]"/><br> 
<h:input_number id="size" valueRef="pbean.size" size="2"> 
<f:validate_required/> 
<f:validate_longrange minimum="1" maximum="7"/> 
</h:input_number> 
<br><h:output_errors for="size"/> 
..........   
</h:form> 
</f:use_faces> 
[/code] 

上面的JSP代碼生成下面的HTML片斷：

<form method="post" action="/usingjsf/faces/edit.jsp"> 
..........  
<p>Size: [1-7]<br> 
<input type="text" name="sie" id="size" value="3" size="2"> 
<br> 
..........  
</form> 

單行文本域被定為size，類型為整形（int）。size中value屬性的值（3）是表示所生成的HTML表單數(shù)字輸入?yún)^(qū)域的初值。假設沒有出現(xiàn)驗證錯誤，當JSF收到包含新JavaBean size屬性值的用戶輸入就會刷新JavaBean。<h:input_number>標記的size屬性是限定單行文本域的字符長度（2），不會對JavaBean屬性有其他操作。

public class PBean implements java.io.Serializable {  
..........  
private int size;  
public int getSize() {  
return size;  
}  
public void setSize(int size) {  
this.size = size;  
}  
..........  
} 

除了<f:validate_required>與<f:validate_longrange>標記，JSF還提供了幾個驗證器標記：

• <validate_doublerange>
• <validate_stringrange>
• <validate_length>
• <validator>

最后一個為通用標記，可以用它在用戶界面組件中注冊你自己的定制驗證器。你也能夠創(chuàng)建自己的驗證器標記庫。

#p#

列表List Box

<h:selectone_listbox>與<h:selectmany_listbox>標記生成HTML元素<select>，網(wǎng)頁瀏覽器會將<select>顯示為列表。前者允許用戶進行單項選擇，后者用于多項選擇。

文件edit.jsp使用<h:selectmany_listbox>標記生成一個含有幾個字體名稱的列表。HTML的<option>元素定義列表中的選項，這由JSF標記<h:selectitem>生成：

<f:use_faces> 
<h:form formName="pform"> 
..........  
<p><h:output_text value="Font:"/><br> 
<h:selectmany_listbox id="font" valueRef="pbean.font"> 
<h:selectitem itemvalue="Arial" 
itemLabel="Arial"/> 
<h:selectitem itemvalue="Courier New" 
itemLabel="Courier New"/> 
<h:selectitem itemvalue="Times New Roman" 
itemLabel="Times New Roman"/> 
</h:selectmany_listbox> 
..........  
</h:form> 
</f:use_faces> 

上面的代碼生成下面的HTML片斷：

<form method="post" action="/usingjsf/faces/edit.jsp"> 
..........  
<p>Font:<br> 
<select name="font" multiple size="3">   
<option value="Arial" selected>Arial</option> 
<option value="Courier New" selected>Courier New</option> 
<option value="Times New Roman">Times New Roman</option> 
</select> 
..........  
</form> 

列表被定義為font，類型為字符串數(shù)組（String[]）。第一個getFont()方法使用clone()方法復制內部的數(shù)組并將其返回，內部數(shù)組必須從外部訪問中得到保護。第一個setFont()方法用clone()方法復制所提供的數(shù)組并保存起來，所提供的數(shù)組可被第二個setFont()方法修改。

public class PBean implements java.io.Serializable {  
..........  
private String fontArray[];  
public String[] getFont() {  
return (String[]) fontArray.clone();  
}  
public void setFont(String fontArray[]) {  
this.fontArray = (String[]) fontArray.clone();  
}  
public String getFont(int index) {  
return fontArray[index];  
}  
public void setFont(int index, String font) {  
if (fontArray == null)  
fontArray = new String[index+1];  
else if (fontArray.length <= index) {  
String oldFontArray[] = fontArray;  
fontArray = new String[index+1];  
for (int i = 0; i < oldFontArray.length; i++)  
fontArray[i] = oldFontArray[i];  
}  
fontArray[index] = font;  
}  
..........  
} 

當生成HTML表單時，JSF將所選的HTML屬性加入到列表選項，列表選項的值被保存在JavaBean模型的字體數(shù)組中。假設沒有驗證錯誤，JSF會在接收到用戶新的選擇字體的輸入時刷新JavaBean屬性。

【編輯推薦】

1. JSF文件在web.xml中啟動異常
2. Ajax優(yōu)于JSF的幾個原因討論
3. JSF理解組件和客戶端標識符
4. JSP像烏云般擋住了JSF的光芒
5. MyEclipse開發(fā)JSF之創(chuàng)建工程淺析