JSF标签学习总结下

---

显示图片

value中加上图片路径

<h:graphicImage value="" />

组件排版

h:panelGrid
例如：

<h:panelGrid columns="2">            <h:outputText value="姓名：" />            <h:inputText id="name" value="" />            <h:outputText value="密码：" />            <h:inputText id="password" value="" />            <h:commandButton value="登录" action="login" />            <h:commandButton value="重置" type="reset" /></h:panelGrid>

显示效果：

表格

例如显示用户名和密码
①编写TableBean和UserBean1

UserBean1.java：

public class UserBean1 {    private String name;    private String password;    public UserBean1() {    }    public UserBean1(String name, String password) {        this.name = name;        this.password = password;    }    public String getName() {        return name;    }    public void setName(String name) {        this.name = name;    }    public String getPassword() {        return password;    }    public void setPassword(String password) {        this.password = password;    }}

TableBean.java：

public class TableBean {    private List<UserBean1> list;    public List<UserBean1> getList() {        if(list==null){            list=new ArrayList<UserBean1>();            list.add(new UserBean1("zwq1", "123"));            list.add(new UserBean1("zwq2", "123"));            list.add(new UserBean1("zwq3", "123"));        }        return list;    }    public void setList(List<UserBean1> list) {        this.list = list;    }}

②在faces-config.xml中配置两个bean：

<managed-bean>        <managed-bean-name>tablebean</managed-bean-name>        <managed-bean-class>beans.TableBean</managed-bean-class>        <managed-bean-scope>request</managed-bean-scope></managed-bean><managed-bean>        <managed-bean-name>userbean1</managed-bean-name>        <managed-bean-class>beans.UserBean1</managed-bean-class>        <managed-bean-scope>request</managed-bean-scope></managed-bean>

③在前台jsp中编写代码如下：

<h:dataTable value="#{tablebean.list }" var="user"><h:column>   <h:outputText value="#{user.name}"></h:outputText></h:column><h:column>   <h:outputText value="#{user.password}"></h:outputText></h:column>

以列为单位，一列列的添加

---

④添加表头、表尾，把③中代码替换为以下代码：

<h:dataTable value="#{tablebean.list }" var="user">            <h:column>                <f:facet name="header">                    <h:outputText value="用户名" />                </f:facet>                <h:outputText value="#{user.name}" />                <f:facet name="footer">                    <h:outputText value="..." />                </f:facet>            </h:column>            <h:column>                <f:facet name="header">                    <h:outputText value="密码" />                </f:facet>                <h:outputText value="#{user.password}" />                <f:facet name="footer">                    <h:outputText value="..." />                </f:facet>            </h:column></h:dataTable>