將驗證新增至 Faces 輸入元件中

您可以設定所有 Faces 輸入元件的進階驗證特性。 比方說,您可以這樣設定「輸入日期/時間」元件的驗證:將它的最小值設為 2003/01/01,將它的最大值設為 "now"。

以下是輸入元件的用戶端和伺服器驗證的基本步驟。
  1. 建立 Faces JSP 檔。
  2. 將輸入元件拖曳至 Faces JSP 檔。
  3. 在「輸入」元件的「內容」視圖中,從「格式」清單中選擇「字串」、「數字」、「日期/時間」或「遮罩」。
  4. 在相同「內容」視圖的驗證標籤上,您可以設定送出輸入時伺服器上的驗證屬性:
    • 如果使用者必須在這個輸入欄位中輸入值,請勾選需要值
    • 輸入最小值最大值。 對於「輸入字串」和「輸入遮罩」元件,輸入所接受的最少和最多字元數。 對於「輸入日期/時間」元件,輸入所接受的最早(最小)日期/時間和最晚(最大)日期/時間。 您也可以輸入 "now" 作為值。對於「輸入數字」元件,請輸入所接受的最低(最小)數字和最高(最大)數字。
    • 勾選在錯誤訊息控制項中顯示驗證錯誤訊息,如果驗證失敗, 就會建立「顯示錯誤」元件,它將連結到這個「輸入」元件並可顯示錯誤訊息。 此時會在頁面上的「輸入」元件旁邊建立「顯示錯誤」元件。
    • 如果您有「輸入字串」元件,您可以從功能表中選取限制。 選項包括:無限制、僅字母字元和僅數字。 無限制是預設值,允許字母數字字元。
    您可以在「快速編輯」視圖的「值已變更」事件中提供其他的驗證。 按按一下以建立/編輯自訂驗證程式碼旁的按鈕,來切換至「快速編輯」視圖。

    請注意,其他輸入元件有類似的驗證標籤。

  5. 行為標籤上,您可以設定瀏覽器的輸入行為。 請注意,「行為」標籤上的選項視輸入元件的類型而有所不同。
    • 設定在驗證成功 (On success) 之後或驗證失敗 (On failure) 之後要使用的樣式表。 按一下套用 CSS 類別旁的瀏覽按鈕來搜尋樣式表。比方說,如果驗證成功,您想要文字變成黑色, 如果驗證失敗,您想要文字變成紅色。在執行動作欄位中,您可以選擇驗證成功時的動作和驗證失敗時的動作。 其選項相同:「停用」欄位、「啟用」欄位和「選取」欄位。
    • 您可以按一下「快速編輯」按鈕,在「快速編輯」視圖的 onsuccess 和 onerror 事件中設定其他動作。
  6. 將「送出」按鈕新增至頁面。
  7. 儲存 Faces JSP 頁面並在伺服器上執行它。

送出不含值的頁面來測試驗證。 這時應該會執行您建立的驗證,且應該會顯示您建立的任何錯誤訊息。

範例:利用「快速編輯」視圖來執行自訂驗證

以下是對於使用者在網頁欄位中輸入的值執行自訂驗證的範例。 在這個範例中,使用者會填寫使用者登錄表單,並按一下送出按鈕。在送出登錄表單之前,您可以建立驗證,以確定「密碼」欄位和「密碼確認」欄位皆包含相同密碼。 您也可以驗證密碼欄位的長度至少有六個字元。 請遵循下列步驟來建立自訂驗證:
  1. 建立包含登錄表單(包括「名稱」、「位址」之類的欄位)和送出按鈕 (commandExButton) 的 Faces JSP 檔。
  2. 將兩個輸入隱藏 (inputSecret) 元件拖曳至 Faces JSP 檔。 第一個元件是「密碼」欄位,第二個是「密碼確認」欄位。
  3. 開啟第一個「輸入隱藏」元件的「內容」視圖。在「驗證」畫面上, 勾選需要值
  4. 設定最小長度為六個字元。
  5. 按一下送出按鈕。
  6. 切換至「快速編輯」視圖(視窗 > 顯示視圖 > 快速編輯) 以顯示送出按鈕。
  7. 在「快速編輯」視圖的右窗格中新增下列程式碼:
    String text1Val = (String)getSecret1().getValue();
    String text2Val = (String)getSecret2().getValue();
    		
    System.out.println("text2Val = " + text1Val + " text2Val = " + text2Val);
    		
    if(!text1Val.equals(text2Val)){
    	System.out.println("NOT THE SAME");
    	FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_ERROR, "Passwords need to be the same", "Values should be the same");
    	getMessages1().setErrorStyle("color:Red");
    	getFacesContext().addMessage(null, message);
    	return "errorCondition";
    }
    return "successCondition";
    FacesMessage 含有下列建構子:
    FacesMessage()
    FacesMessage(FacesMessage.Severity, String summary, String detail)
    FacesMessage(String summary)
    FacesMessage(String summary, String detail)
  8. 儲存 Faces JSP 檔並在伺服器中執行它。
相關概念
JavaServer Faces
相關工作
建立自訂驗證器
將輸入元件新增至 Faces JSP 檔中
建立 Faces 應用程式 - 概觀
建立 Faces JSP 檔
相關參考
Faces 元件參照
Faces 元件的屬性
使用條款 | 讀者意見
(C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.