JSF---->表格处理

JSF表格

<h:dataTable>标签显示表格

 <f:view>
    <h:dataTable value="#{tableBean.userList}" var="user">
        <h:column>
            <h:outputText value="#{user.name}"/>
        </h:column>
        <h:column>
            <h:outputText value="#{user.password}"/>
        </h:column>
    </h:dataTable>
 </f:view>

h:dataTable的value属性值绑定的对象可以使一下类型

  1. 阵列
  2.  java.util.List的实例
  3. java.sql.ResultSet的实例
  4. javax.servlet.jsp.jstl.sql.Result的实例
  5. javax.faces.model.DataModel的实例

对于前四种型态，JSF实际上是以javax.faces.model.DataModel加以包装，DataModel是个抽象类别，其子类别都是位于 javax.faces.model这个package下：ArrayDataModel、ListDataModel 、ResultDataModel 、ResultSetDataModel 、ScalarDataModel

1、list形式

package wsz.ncepu;

import java.util.*;

public class TableBean {

	private List<User> userList;

	public List<User> getUserList() {
		if (userList == null) {

			userList = new ArrayList<User>();
			userList.add(new User("张三", "123456"));
			userList.add(new User("李四", "123456"));
			userList.add(new User("王五", "123456"));
		}

		return userList;

	}

}

index.jsp

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<html>
	<head>
		<title>jsf</title>
		<link href="../styles.css" rel="stylesheet" type="text/css" />

	</head>
	<body>

		<f:view>
			<h:dataTable value="#{tableBean.userList}" var="user"
				styleClass="orders" headerClass="ordersHeader"
				rowClasses="evenColumn,oddColumn">

				<h:column>
					<f:facet name="header">
						<h:outputText value="Name" />
					</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="Password" />
					</f:facet>
					<h:outputText value="#{user.password}" />
					<f:facet name="footer">
						<h:outputText value="****" />
					</f:facet>
				</h:column>
			</h:dataTable>



		</f:view>
	</body>
</html>

2、DataModel类型

TableBean.java

package wsz.ncepu;

import java.util.*;

import javax.faces.model.DataModel;
import javax.faces.model.ListDataModel;

public class TableBean {
	private DataModel model;
	private int rowIndex = -1;

	public DataModel getUsers() {
		if (model == null) {
			model = new ListDataModel();
			model.setWrappedData(getUserList());
		}

		return model;
	}

	// 私有方法，页面无法绑定
	private List<User> getUserList() {
		List<User> userList = new ArrayList<User>();
		userList.add(new User("张三", "123456"));
		userList.add(new User("李四", "123456"));
		userList.add(new User("王五", "123456"));

		return userList;
	}

	public int getSelectedRowIndex() {
		return rowIndex;
	}

	public String select() {
		rowIndex = model.getRowIndex();
		return "success";
	}
}

在这个Bean中，（getUserList为私有方法，页面的datatable如果绑定userList则有错误，找不到属性）我们直接设定DataModel，将userList设定给它，如您所看到的，我们还可以取得DataModel的各个变项，在这个例子中，select()将作为点选表格之后的事件处理方法，我们可以藉由DataModel的getRowIndex ()来取得所点选的是哪一row的资料，例如：

index.jsp
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<link href="../styles.css" rel="stylesheet" type="text/css"/>
<body>
<f:view>
    <h:form>                     
        <h:dataTable value="#{tableBean.users}" var="user"
          styleClass="orders"
          headerClass="ordersHeader"
          rowClasses="evenColumn,oddColumn">
            <h:column>
                <f:facet name="header">
                    <h:outputText value="Name"/>
                </f:facet>
                <h:commandLink action="#{tableBean.select}">
                    <h:outputText value="#{user.name}"/>
                </h:commandLink>
                    
                <f:facet name="footer">
                    <h:outputText value="****"/>
                </f:facet>
            </h:column>
            <h:column>
                <f:facet name="header">
                    <h:outputText value="Password"/>
                </f:facet>             
                <h:outputText value="#{user.password}"/>
                <f:facet name="footer">
                    <h:outputText value="****"/>
                </f:facet>
            </h:column>
        </h:dataTable>
    </h:form>
    Selected Row: <h:outputText 
                     value="#{tableBean.selectedRowIndex}"/>
</f:view>
</body> 
</html>

faces-config.xml

<?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE faces-config PUBLIC "-//Sun Microsystems,
    Inc.//DTD JavaServer Faces Config 1.0//EN"
   "http://java.sun.com/dtd/web-facesconfig_1_0.dtd">

 <faces-config>
    <managed-bean>
        <managed-bean-name>tableBean</managed-bean-name>
        <managed-bean-class>
            wsz.ncepu.TableBean
        </managed-bean-class>
        <managed-bean-scope>request</managed-bean-scope>
    </managed-bean>
  </faces-config>

styles.css

.orders { border: thin solid black; } 
.ordersHeader {text-align:center; font-style:italic; color: Snow; background: Teal; } 
.evenColumn{ height: 25px; text-align: center; background: MediumTurquoise; }
.oddColumn { text-align: center; background: PowderBlue; }

DataModel的rowIndex是从0开始计算，当处理ActionEvent时，JSF会逐次递增rowIndex的值，这让您可以得知目前正在处理的是哪一个row


 

posted on 2012-05-17 23:09  小强斋太  阅读(323)  评论(0)    收藏  举报

导航