JSF教學 » JSF <h:inputText>標籤

JSF <h:inputText>標籤

JSF <h:inputText>標籤用於呈現網頁上的輸入欄位。它在<h:form>標籤中用於宣告允許使用者輸入資料的輸入欄位。

value屬性指的是名為User的委託Bean的name屬性。該屬性儲存名稱元件的資料。 使用者提交表單後，User中的name屬性的值將被設定為與該標籤對應的欄位中輸入的文字。

開啟 NetBean8.2，建立一個名稱為：htags的JSF工程，然後按以下步驟新增相應檔案和程式碼。

JSF <h:InputText>標籤範例

在下面的範例中，我們使用標籤標籤為inputText標籤提供標籤，一個帶有屬性的inputText，一個用於表示提交按鈕的commandButton。 全部都被包含在<h:form>標籤中。

檔案： inputtext.xhtml 的程式碼如下所示 -

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
    <h:head>
        <title>Facelet Title</title>
    </h:head>
    <h:body>
        <h:form id="form">  
            <h:inputText id="username" value="#{user.name}" label="username" maxlength="10"            
                         size="15" alt="username" autocomplete="off" readonly="false" required="true"              
                         requiredMessage="Username is required" style="color:red" accesskey="q">  
            </h:inputText>   </h:form>
    </h:body>
</html>

2)建立託管Bean

檔案： User.java 的程式碼如下所示 - 

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package com.yiibai;

/**
 *
 * @author Maxsu
 */
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

@ManagedBean
@RequestScoped
public class User {

    String name;
    String email;
    String password;
    String gender;
    String address;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    public String getGender() {
        return gender;
    }

    public void setGender(String gender) {
        this.gender = gender;
    }

    public String getAddress() {
        return address;
    }

    public void setAddress(String address) {
        this.address = address;
    }
}

JSF渲染<h:inputText>標籤如下：

程式碼如下所示 - 

<input id="userform:username" name="userform:username" autocomplete="off" accesskey="q"   
alt="username" maxlength="10" size="15" style="color:red" type="text">

4)執行應用程式

開啟瀏覽器，存取：http://localhost:8084/htags/faces/inputtext.xhtml ， 輸出如下所示 -

JSF <h:inputText> 標籤的屬性

屬性名稱 描述
id 它是此元件的識別符號，ID必須是唯一的。您可以使用它來存取CSS和JS檔案中的HTML元素。
value 它用於收集輸入文字的當前值。
class 它給元件的類名，它用於從CSS和JS檔案存取元件。
maxlength 在此欄位中可能輸入的最大字元數。
alt 由該元件呈現的元素的替代文字描述。
accesskey 按鍵的存取鍵將焦點轉移到該元素。它將根據瀏覽器的不同而不同。
size 用於確定此欄位寬度的字元數。
required 它表示使用者需要為此輸入元件提供提交的值。
requiredMessage 如果將required屬性設定為true，則在「RequiredMessage」中提供的訊息描述將顯示到網頁。
style 它用於為元件應用CSS。
rendered 它用於渲染元件。該屬性的預設值為true。
convertor 它用於註冊此元件的轉換器範例。
readonly 它表示該元件禁止使用者進行更改，通過將readonly作為此屬性的值傳遞，可以使元件唯讀。 例如。 readonly =「readonly」