[ x:dataScroller ]

■2005/9/8
 Hepon

■環境:JSF1.1
    MyFaces1.0.9
    WindowsXP
    ExadelStudioPro3.0.3

■時間があれば後で解説を記述します。
 ひとまず画面写真とソースをどうぞ。


★DataTable001Bean.java
package demo;

import java.util.ArrayList;

public class DataTable001Bean {

	private ArrayList testlist;


	public DataTable001Bean() {
		testlist = new ArrayList();
		testlist.add(new DataTable002Bean("aaa","bbb"));
		testlist.add(new DataTable002Bean("ccc","ddd"));
		testlist.add(new DataTable002Bean("eee","fff"));
		testlist.add(new DataTable002Bean("ggg","hhh"));
		testlist.add(new DataTable002Bean("iii","jjj"));
		testlist.add(new DataTable002Bean("kkk","lll"));
		testlist.add(new DataTable002Bean("mmm","nnn"));
		testlist.add(new DataTable002Bean("ooo","ppp"));
		testlist.add(new DataTable002Bean("qqq","rrr"));
		testlist.add(new DataTable002Bean("sss","ttt"));
		testlist.add(new DataTable002Bean("sss","ttt"));
		testlist.add(new DataTable002Bean("sss","ttt"));
		testlist.add(new DataTable002Bean("sss","ttt"));
		testlist.add(new DataTable002Bean("sss","ttt"));
		//作成したい件数分addを繰り返してください。
	}
	
	public ArrayList getTestlist() {
		return testlist;
	}
	public void setTestlist(ArrayList testlist) {
		this.testlist = testlist;
	}

}

★DataTable002Bean.java
package demo;

public class DataTable002Bean {

	private String column001;
	private String column002;
	
	public DataTable002Bean(String str1,String str2){
		
		column001 = str1;
		column002 = str2;
	}

	public String getColumn001() {
		return column001;
	}

	public void setColumn001(String column001) {
		this.column001 = column001;
	}

	public String getColumn002() {
		return column002;
	}

	public void setColumn002(String column002) {
		this.column002 = column002;
	}
	
}

★dataScroller.jsp
<%@ page contentType="text/html;charset=MS932" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://myfaces.sourceforge.net/tld/myfaces_ext_0_9.tld" prefix="x" %> 

<!-- ↓これは使用しない -->
<f:loadBundle basename="demo.bundle.Messages" var="Message"/>

<!-- ********************* -->

<HTML>
    <HEAD>
        <title>x:dataScroller サンプル</title>
    </HEAD>
    <style TYPE="text/css">
    <!--
        .t { font-size: 10pt; }
    -->
    </style>
    <body bgcolor="white">
    
    <f:view>
    
    <!-- ********************* -->
    
        <h1><h:outputText value="x:dataScroller サンプル"/></h1>
        <h:outputText value="2005/9/7/Wed/Hepon"/><br>
        <br>
        
        <!-- ↓テーブル↓ -->
        <x:dataTable id="testTable001" 
                        value="#{dataTable001Bean.testlist}" 
                        var="tlist" border="1" 
                        bgcolor="#F5DEB3" 
                        cellpadding="3" 
                        cellspacing="3" 
                        width="250"
                        rows="3">

            <f:facet name="header">
                <h:outputText value="ヘッダ" />
            </f:facet>
            
            <h:column>
                <f:facet name="c1">
                    <h:outputText value="カラム1" />
                </f:facet>
                <h:outputText id="colmun001" value="#{tlist.column001}" />
            </h:column>
            
            <h:column>
                <f:facet name="c2">
                    <h:outputText value="カラム2" />
                </f:facet>
                <h:outputText id="colmun002" value="#{tlist.column002}" />
            </h:column>
        
        </x:dataTable>
        
        <br>
        <!-- ↓データスクローラー1↓ -->
        <x:dataScroller id="scroll001"
                            for="testTable001"
                            fastStep="10"
                            pageCountVar="pageCount"
                            pageIndexVar="pageIndex"
                            paginator="true"
                            paginatorMaxPages="10"
                            paginatorActiveColumnStyle="font:bold;">
            <f:facet name="first"><h:outputText value="[最初]" styleClass="t" /></f:facet>
            <f:facet name="last"><h:outputText value="[最後]" styleClass="t" /></f:facet>
            <f:facet name="previous"><h:outputText value="[前へ]" styleClass="t" /></f:facet>
            <f:facet name="next"><h:outputText value="[次へ]" styleClass="t" /></f:facet>
            <f:facet name="fastforward"><h:outputText value="[10ページ進む]" styleClass="t" /></f:facet>
            <f:facet name="fastrewind"><h:outputText value="[10ページ戻る]" styleClass="t" /></f:facet>
        </x:dataScroller>
        
        <!-- ↓データスクローラー2↓ -->
        <x:dataScroller id="scroll002"
                            for="testTable001"
                            pageCountVar="pageCount"
                            pageIndexVar="pageIndex">
            <h:outputFormat value="ページ:{0}/{1}" styleClass="standard">
                <f:param value="#{pageIndex}" />
                <f:param value="#{pageCount}" />
            </h:outputFormat>
        </x:dataScroller>
        
    <!-- ********************* -->
    
    </f:view>
    
    </body>
</HTML>  

★index.jsp
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">

<html>
<head>
</head>
<body>
    <jsp:forward page="/pages/dataScroller.jsf" />
</body>
</html>

★web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
 <display-name>htc007</display-name>
 <context-param>
  <param-name>javax.faces.STATE_SAVING_METHOD</param-name>
  <param-value>server</param-value>
 </context-param>
 <context-param>
  <param-name>javax.faces.CONFIG_FILES</param-name>
  <param-value>/WEB-INF/faces-config.xml</param-value>
 </context-param>
 
    <context-param>
        <param-name>org.apache.myfaces.ALLOW_JAVASCRIPT</param-name>
        <param-value>true</param-value>
    </context-param>
    
    <context-param>
        <param-name>org.apache.myfaces.DETECT_JAVASCRIPT</param-name>
        <param-value>false</param-value>
    </context-param>

    <context-param>
        <param-name>org.apache.myfaces.PRETTY_HTML</param-name>
        <param-value>true</param-value>
    </context-param>

    <context-param>
        <param-name>org.apache.myfaces.AUTO_SCROLL</param-name>
        <param-value>true</param-value>
    </context-param>
   
    <filter>
        <filter-name>extensionsFilter</filter-name>
        <filter-class>org.apache.myfaces.component.html.util.ExtensionsFilter</filter-class>
        <init-param>
            <param-name>uploadMaxFileSize</param-name>
            <param-value>100m</param-value>
        </init-param>
        <init-param>
            <param-name>uploadThresholdSize</param-name>
            <param-value>100k</param-value>
        </init-param>
    </filter>
    
    <filter-mapping>
        <filter-name>extensionsFilter</filter-name>
        <url-pattern>*.jsf</url-pattern>
    </filter-mapping>
    <filter-mapping>
        <filter-name>extensionsFilter</filter-name>
        <url-pattern>/faces/*</url-pattern>
    </filter-mapping>

    <!-- Listener, that does all the startup work (configuration, init). -->
    <listener>
        <listener-class>org.apache.myfaces.webapp.StartupServletContextListener</listener-class>
    </listener>
 
 <servlet>
  <servlet-name>Faces Servlet</servlet-name>
  <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
  <load-on-startup>1</load-on-startup>
 </servlet>
 <servlet-mapping>
  <servlet-name>Faces Servlet</servlet-name>
  <url-pattern>*.jsf</url-pattern>
 </servlet-mapping>
 
    <!-- Welcome files -->

    <welcome-file-list>
        <welcome-file>index.jsf</welcome-file>
        <welcome-file>index.jsp</welcome-file>
        <welcome-file>index.html</welcome-file>
    </welcome-file-list>
 
</web-app>

★faces-config.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE faces-config PUBLIC "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN"
                              "http://java.sun.com/dtd/web-facesconfig_1_1.dtd">
<faces-config>
 <managed-bean>
  <managed-bean-name>dataTable001Bean</managed-bean-name>
  <managed-bean-class>demo.DataTable001Bean</managed-bean-class>
  <managed-bean-scope>session</managed-bean-scope>
 </managed-bean>
 <lifecycle/>
 <application>
  <locale-config/>
 </application>
 <factory/>
</faces-config>