用于操作和导航的JSF命令组件标签
JSF提供了两个命令组件标签,用于执行操作和导航。
他们是
- <h:commandButton>标记
- <h:commandLink>标记
让我们详细看看上述每个标签的功能。
<h:commandButton>标记
<h:commandButton>标记呈现一个提交表单的按钮,从而为处理用户输入的数据铺平了道路。
commandButton指定动作属性,其中可以指定导航详细信息,例如单击按钮时要呈现的页面。
考虑一个示例,演示单击按钮时提交表单的情况。
创建页面" mobile.xhtml"为;
mobile.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml"
xmlns:h="https://java.sun.com/jsf/html">
<h:head>
<title>Add a button</title>
</h:head>
<h:body>
<h3>Adding a button</h3>
<h:form>
<h:panelGrid columns="3">
<h:outputLabel for="companyname">Company Name:</h:outputLabel>
<h:inputText value="#{mobile.companyname}" id="companyname"></h:inputText>
<br
<br
<h:outputLabel for="model">Model Number:</h:outputLabel>
<h:inputText value="#{mobile.modelnumber}" id="model" size="20"></h:inputText>
<br
<br
<h:outputLabel for="color">Color:</h:outputLabel>
<h:inputText value="#{mobile.color}" id="color" size="20"></h:inputText>
<br
<br
<h:commandButton value="Submit" action="mobdetails"></h:commandButton>
</h:panelGrid>
</h:form>
</h:body>
</html>
其中我们声明字段名称,型号和颜色。
我们使用commandButton标记显示"提交"按钮,并提到借助action属性将导航重定向到" mobdetails"页面。
现在,我们将创建" mobdetails.xhtml"页面,该页面显示用户在mobile.xhtml页面中输入的详细信息;
mobdetails.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml"
xmlns:h="https://java.sun.com/jsf/html">
<h:head>
<title>Command Button Tag</title>
</h:head>
<h:body>
Mobile Company Name:#{mobile.companyname}
<br
<br
Mobile model Number:#{mobile.modelnumber}
<br
<br
Color:#{mobile.color}
<br
<br
</h:body>
</html>
其中我们用点运算符调用Bean名称,后跟字段名称以从Bean类中获取值。
创建托管bean Mobile.java为
package com.theitroad.jsf.beans;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
@ManagedBean
@SessionScoped
public class Mobile {
private String companyname;
private String modelnumber;
private String color;
public Mobile() {
}
public Mobile(String companyname, String modelnumber, String color) {
this.companyname = companyname;
this.modelnumber = modelnumber;
this.color = color;
}
public String getCompanyname() {
return companyname;
}
public void setCompanyname(String companyname) {
this.companyname = companyname;
}
public String getModelnumber() {
return modelnumber;
}
public void setModelnumber(String modelnumber) {
this.modelnumber = modelnumber;
}
public String getColor() {
return color;
}
public void setColor(String color) {
this.color = color;
}
}
其中我们声明名称,型号和颜色这三个字段,并编写用于设置和检索值的getter和setter方法。
现在运行mobile.xhtml页面,它将在浏览器中产生以下输出。
<h:commandLink>标记
commandLink提供了等效于HTML中锚标记的超链接,该超链接的作用类似于提交按钮,并且可以与支持bean或者操作类关联以进行事件处理。
action属性可用于指定导航,或者actionListener可用于处理来自Bean类的导航。
考虑一个示例,该示例演示了commandLink标记用于呈现超链接的用法。
创建页面" mobilehyperlink.xhtml"为;
mobilehyperlink.xhtml
<?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="https://www.w3.org/1999/xhtml" xmlns:h="https://java.sun.com/jsf/html"> <h:head> <title>Command Link tag</title> </h:head> <h:body> <h3>Command Link tag example</h3> <h:form> <h:commandLink value="Add Mobile Details" action="mobile"></h:commandLink> <br <br <h:commandLink value="View Mobile Details" action="viewdetails"></h:commandLink> </h:form> </h:body> </html>
其中我们指定两个超链接,一个超链接用于添加移动设备的详细信息,另一个通过在action属性中指定视图页面名称来显示移动设备的详细信息。
创建viewdetails.xhtml为;
viewdetails.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml"
xmlns:h="https://xmlns.jcp.org/jsf/html">
<h:head>
<title>Mobile Details Page</title>
</h:head>
<h:body>
Mobile Company Name:Micromax
<br
<br
Model Number:A-114 Canvas 2.2
<br
<br
Color:White
</h:body>
</html>
我们将重新使用上面创建的mobile.xhtml页面来添加移动设备的详细信息。
现在运行该应用程序.

