zoukankan      html  css  js  c++  java
  • 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


  • 相关阅读:
    根据汉字获取其的首个字母
    jqure获取单选按钮的值(比如性别)
    dataset 和DataTable的用法
    利用ExcelDataReader封装类 导入表格数据
    批量导入数据.net
    一个按下键盘触发事件的例子
    Build Error 6041: Internal build error
    Word 2010巧妙绘制各种分割线的方法(图文)
    vbscript multiple line syntax
    Update msi using vbscript
  • 原文地址:https://www.cnblogs.com/xiaoqiangzhaitai/p/5637671.html
Copyright © 2011-2022 走看看