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
運行結果如下 -
未輸入值直接提交,結果如下 -
輸入值後提交,結果如下 -