JSFJSF用戶界面組件模型
JSF UI組件示例
JSF <h:inputText>標籤
JSF <h:outputText>標籤
JSF <h:form>標籤
JSF <h:commandButton>標籤
JSF <h:inputtextarea>標籤
JSF <h:commandLink>標籤
JSF <h:inputSecret>標籤
JSF <h:inputHidden>標籤
JSF <h:inputFile>標籤
JSF <h:graphicImage>標籤
JSF <h:message>標籤
JSF <f:ajax>標籤
JSF單選按鈕
JSF表單組合框
JSF列表框
JSF多選列表框
JSF輸出格式化
JSF輸出樣式
JSF <h:attribute>標籤
JSF <h:setPropertyActionListener>標籤
JSF <h:message>標籤
它用於顯示特定組件的單個消息。您可以通過將該組件的id
傳遞給for
屬性來顯示您的自定義消息。
以下JSF標籤 -
<h:inputText id="username" size="20" label="UserName" required="true">
<f:validateLength for="username" minimum="5" maximum="20" />
</h:inputText>
<h:message for="username" style="color:red" />
如果輸入超過20個字符時提示 -
<span style="color:red">UserName: Validation Error:
Length is greater than allowable maximum of '20'</span>
如果輸入小於5
個字符時提示 -
<span style="color:red">UserName: Validation Error:
Length is less than allowable minimum of '5'</span>
如果輸入字段未輸入時提示 -
<span style="color:red">UserName: Validation Error: Value is required</span>
JSF <h:graphicImage>
標籤的屬性
標籤
描述
for
它是用於分配組件ID的強制性標籤,因爲該消息是組成的。
errorClass
它用於將CSS樣式類應用於嚴重性類爲「ERROR
」的任何消息。
errorStyle
它用於將CSS樣式應用於嚴重性級別爲「ERROR
」的任何消息。
fatalClass
它用於將CSS樣式類應用於嚴重性級別爲「FATAL
」的任何消息。
FatalStyle
它用於將CSS樣式應用於嚴重性級別爲「FATAL
」的任何消息。
infoClass
它用於將CSS樣式類應用於嚴重性級別爲「INFO
」的任何消息。
InfoStyle
它用於將CSS樣式應用於嚴重性級別爲「INFO
」的任何消息。
tooltip
它用於將消息的詳細信息部分顯示爲工具提示。
warnClass
它用於將CSS樣式類應用於嚴重性類爲「WARN
」的任何消息。
warnStyle
它用於將CSS樣式應用於嚴重性級別爲「WARN」的任何消息。
實例
文件: index.xhtml 中有如下代碼 -
<?xml version="1.0" encoding="UTF-8"?>
<!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://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:body>
<h:form>
<h:messages style="color:red;margin:8px;" />
<br />
<h:panelGrid columns="3">
Enter your username :
<h:inputText id="username" value="#{user.username}"
size="20" required="true"
label="UserName" >
<f:validateLength minimum="5" maximum="10" />
</h:inputText>
<h:message for="username" style="color:red" />
Enter your age :
<h:inputText id="age" value="#{user.age}"
size="20" required="true"
label="Age" >
<f:validateLongRange for="age" minimum="1" maximum="200" />
</h:inputText>
<h:message for="age" style="color:red" />
</h:panelGrid>
<h:commandButton value="Submit" action="result" />
</h:form>
</h:body>
</html>
文件: UserBean.java 中有如下代碼 -
package com.yiibai;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
@ManagedBean(name="user")
@SessionScoped
public class User implements Serializable{
private static final long serialVersionUID = 1L;
public String username;
public int age;
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
}
以下是result.xhtml
文件中的代碼 -
<?xml version="1.0" encoding="UTF-8"?>
<!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://java.sun.com/jsf/html">
<h:body>
Username : #{user.username}
<br />
Age : #{user.age}
</h:body>
</html>
運行項目
啓動Tomcat完成後,在瀏覽器地址欄中輸入以下URL。
http://localhost:8080/hjsf/index.xhtml
運行結果如下 -
未輸入值直接提交,結果如下 -
輸入值後提交,結果如下 -