將輸入元件新增至 Faces JSP 頁面中

您新增至 Faces JSP 頁面的輸入元件提供一種方式, 讓使用者能夠建立和更新 Web 應用程式的資料。選用區的「Faces 元件」抽屜中的輸入元件包括: 「輸入」、「輸入文字區域」、「Rich Text Area」、「輸入 - 密碼」和「輸入 - 隱藏」。

如果要將「輸入」元件新增至頁面中,請執行下列動作:
  1. 將「輸入」元件從選用區拖曳至頁面。 這時「內容」視圖會顯示「輸入」元件的內容。
  2. 在「輸入」元件 (inputText) 的「內容」視圖中, 您可以設定下列內容:您也可以將元件連結至欄位中的記錄。 如果要連結控制項,您可以按一下位於內容視圖的「基本」標籤的值欄位旁的「連結至」按鈕, 或從「頁面資料」視圖中直接將內容拖曳至控制項。 只有在已定義資料來源的情況下,這兩個方法才有用。
    • 選擇性地,變更輸入元件自動產生的 ID
    • 設定樣式內容(字型、字型大小、佈置、顏色)和樣式類別(樣式表)。
    • 欄位中,將元件連結到記錄。 如果要連結元件,您可以按一下位於欄位旁的「連結至」按鈕, 或從「頁面資料」視圖中直接將內容拖曳至元件。 請注意,只有在已定義資料來源的情況下,這兩個方法才有用。
  3. 從清單中選擇格式:
    格式 說明
    字串 這是預設格式。可讓使用者輸入字母數字文字字串。
    數字 可讓使用者輸入數字。 如果您選擇數字,可在畫面上設定下列數字內容:
    • 類型:選擇十進位、貨幣、百分比或自訂。如果您選擇「自訂」,可自訂數字樣式。 比方說,利用 0.00%,您可以使用百分比的十進位。
    • 輸入輔助 - 顯示 Helper 按鈕:如果您想要新增微調按鈕或滑塊來協助使用者選擇數字,請勾選顯示 Helper 按鈕。 微調按鈕可讓使用者在選取值時利用箭頭來增加或減少值。 滑塊可讓使用者輸入一個範圍內的值。您也可以對這兩個 Helper 指定增量。 比方說,如果您輸入 10 作為增量, 則滑塊或微調按鈕會將數字增加 10。如果您有較大數字,則這個選項很有幫助。 您也可以對微調按鈕和滑塊指定上限和下限。
    • 顯示提示字元:使瀏覽器上的輸入數字自動格式化。 比方說,如果使用者輸入像 1234567 之類的數字,則會在適當位置自動插入逗點: 1,234,567。您可以從數個提示字元當中選擇。 勾選這個內容也會在您於伺服器中執行時使提示字元顯示出來。

      請注意,自動格式化對百分比數字和自訂格式化沒有作用。

    日期/時間 可讓使用者輸入日期、時間或兩者。 如果您選擇日期/時間,可設定下列屬性:
    • 類型:從清單中選擇「僅日期」、「僅時間」或「兩者」。
    • 日期樣式:設定日期的樣式。比方說:Apr 2, 2004。如果您選擇「自訂」, 可在型樣欄位中設定自訂日期樣式型樣。
    • 時間樣式:設定時間的樣式。比方說:11:29:48 PM。如果您選擇「自訂」, 可在型樣欄位中設定自訂時間樣式型樣。
    • 輸入輔助:勾選顯示 Helper 按鈕可為使用者新增行事曆 Helper (如果您選擇「日期」)或時鐘 Helper(如果您選擇「時間」)。 如果您新增時鐘 Helper,也可以設定增量。
    • 顯示提示字元:使瀏覽器上的輸入日期自動格式化。 比方說,輸入日期可能顯示為 "__/__/____"。當使用者輸入日期時,即取代底線字元 ( _ )。
    • 提示字元:以您在這裡指定的字元取代預設底線字元 ( _ )。
    遮罩 設定遮罩來過濾使用者輸入的字母數字。 如果您選擇遮罩,可設定下列屬性:
    • 遮罩:選擇預先定義的遮罩或輸入您自己的遮罩。井字號 (#) 代表數字,問號 (?) 代表字母。 遮罩可幫助使用者輸入電話號碼或識別證號碼(可為字母和數字的混合)。
    • 輸入輔助 - 顯示提示字元:使瀏覽器上的輸入資料自動格式化。 比方說,如果您指定「遮罩」"###-##-####",則輸入欄位顯示為 "___-__-____"。當使用者輸入數字時,即取代底線字元 ( _ )。
  4. 驗證標籤上(在 inputText 之下), 您可以在送出使用者輸入的資料時在伺服器上設定驗證。 您可以勾選需要值來要求使用者輸入。 您可以設定最小值和最大值。您可以設定字串的限制,只接受英文字母或數字字串。 勾選在錯誤訊息控制項中顯示驗證錯誤訊息,如果輸入元件的驗證失敗, 就會自動建立「顯示錯誤」元件來顯示錯誤訊息。 按按一下以建立/編輯自訂驗證程式碼來切換至「快速編輯」視圖,及建立自訂程式碼。
  5. 行為標籤上(在 inputText 之下), 您可以在用戶端上設定輸入元件的行為和驗證。 您可以停用使用者的元件,使元件成為使用者唯讀元件, 當使用者輸入資料完畢前進到下一個元件,或設定要送出至伺服器之元件的最大長度。 您也可以在用戶端啟用驗證,並選擇驗證成功或失敗的動作。 比方說,您可以在使用者成功時停用輸入欄位。 (請注意,如果您想要「自動前進至下一個控制項」對「日期/時間」元件有作用, 您也必須選取驗證標籤上的「在欄位中顯示原型遮罩」。
  6. 協助工具標籤上(在 inputText 之下), 您可以設定鍵盤按鍵作為存取鍵(在執行時期按一下這個鍵會使元件成為焦點)、 元件的定位次序和標題(它可在執行時期提供使用者要訣)。
  7. 除了將輸入元件新增至頁面上,您也可以將下列輸入元件拖曳至頁面上:
    元件 說明
    輸入 - 文字區域 多行的文字輸入欄位。 您可以在「內容」畫面上設定行數。其他大部分內容類似輸入元件的內容。
    Rich Text Area 可讓使用者建立和編輯 Rich Text 文件的 Rich Text 欄位。
    輸入 - 密碼 讓使用者輸入密碼的文字輸入欄位。
    輸入 - 隱藏 隱藏的輸入欄位。 「輸入 - 隱藏」元件通常是由開發人員用於在頁面之間或頁面的控制項之間傳遞資料。
如果要檢視關於 Faces Web 應用程式的一些限制,請參閱限制:Faces JSP 應用程式
相關概念
JavaServer Faces
相關工作
建立 Faces 應用程式 - 概觀
建立 Faces JSP 檔
將驗證新增至 Faces 輸入元件中
建立輸入表單
相關參考
Faces 元件參照
Faces 元件的屬性
使用條款 | 讀者意見
(C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.