Pagination with DisplayTag

Bookmark and Share
Displaytag is an opensource tag library that can be used to display tables on JSPs. Apart from being able to display tables, the displaytag library also has support for JSR-168 compliant portals through the "Display portal compatibility library", and also supports exporting tables to Excel through the "Excel export module". The following example demonstrates the use of DisplayTag to display a long list as a multi-page table. For this example, I used the default EMP table from the sample database which will be built at during Oracle installation. This example uses Oracle 10g R2, Java 5, Tomcat 5.5 and Hibernate 3.2.
Skip to Sample Code
To run the example, follow these steps:
  1. Download Displaytags from here, and include the displaytag-1.1.jar file in your classpath.
  2. Download the latest version of hibernate from hibernate.org, and include all the required jars in your classpath.
  3. Create the pagingEmp.jsp page as shown below
    <jsp:root version="1.2" xmlns:jsp="http://java.sun.com/JSP/Page"
    xmlns:display="urn:jsptld:http://displaytag.sf.net">
    <jsp:directive.page contentType="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" href="css/screen.css" />
    <jsp:scriptlet>
    session.setAttribute( "EmpList", data.DAO.getData());
    </jsp:scriptlet>
    <h2 align="center">Emp Table with Display tag</h2>
    <display:table name="sessionScope.EmpList" pagesize="4">
    <display:column property="empId" title="ID" />
    <display:column property="empName" title="Name" />
    <display:column property="empJob" title="Job" />
    <display:column property="empSal" title="Salary" />
    </display:table>
    </jsp:root>
    pagingEmp.jsp
  4. Create the Employee class, which is the bean that will hold the Employee data as shown below:
    public class Employee {
    public long empId;
    public String empName;
    public String empJob;
    public long empSal;
    public long getEmpId() {
    return empId;
    }
    public void setEmpId(long empId) {
    this.empId = empId;
    }
    public String getEmpJob() {
    return empJob;
    }
    public void setEmpJob(String empJob) {
    this.empJob = empJob;
    }
    public String getEmpName() {
    return empName;
    }
    public void setEmpName(String empName) {
    this.empName = empName;
    }
    public long getEmpSal() {
    return empSal;
    }
    public void setEmpSal(long empSal) {
    this.empSal = empSal;
    }
    }
    Employee.java
  5. Define the styles for displaying the table. Displaytag renders the tables as simple HTML tables, with the standart tr,td,th and table tags. The css file is shown below
    td {
    font-size: 0.65em;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 11px;
    }
    th {
    font-size: 0.85em;
    border-top: 2px solid #ddd;
    border-right: 2px solid #ddd;
    border-left: 2px solid #666;
    border-bottom: 2px solid #666;
    }
    table {
    border: 1px dotted #666;
    width: 80%;
    margin: 20px 0 20px 0;
    }
    th,td {
    margin: 0;
    padding: 0;
    text-align: left;
    vertical-align: top;
    background-repeat: no-repeat;
    list-style-type: none;
    }
    thead tr {
    background-color: #bbb;
    }
    tr.odd {
    background-color: #fff;
    }
    tr.even {
    background-color: #ddd;
    }
    screen.css
  6. Configure Hibernate for accessing database
    1. Create the Employee.hbm.xml file to map the Employee bean with the database table as shown below
      <?xml version="1.0"?>
      <!DOCTYPE hibernate-mapping PUBLIC
      "-//Hibernate/Hibernate Mapping DTD 3.0//EN"
      "http://hibernate.sourceforge.net/hibernate-mapping-3.0.dtd">
      <hibernate-mapping>
      <class name="beans.Employee" table="Emp">
      <id name="empId" column="EMPNO" type="long">
      <generator class="native"/>
      </id>
      <property name="empName" column="ENAME" />
      <property name="empJob" column="JOB" />
      <property name="empSal" column="SAL" type="long"/>
      </class>
      </hibernate-mapping>
      Employee.hbm.xml

      This file is placed in the same directory as the Employee.java class.
    2. Create the Hibernate Configuration file hibernate.cfg.xml in the root directory of the classes.
      <?xml version='1.0' encoding='utf-8'?>
      <!DOCTYPE hibernate-configuration PUBLIC
      "-//Hibernate/Hibernate Configuration DTD 3.0//EN"
      "http://hibernate.sourceforge.net/hibernate-configuration-3.0.dtd">
      <hibernate-configuration>
      <session-factory>
      <property name="connection.driver_class">oracle.jdbc.driver.OracleDriver</property>
      <property name="connection.url">jdbc:oracle:thin:@localhost:1521/orcl</property>
      <property name="connection.username">scott</property>
      <property name="connection.password">tiger</property>
      <property name="dialect">org.hibernate.dialect.Oracle9Dialect</property>
      <mapping resource="beans/Employee.hbm.xml"/>
      <property name="hibernate.current_session_context_class">thread</property>
      </session-factory>
      </hibernate-configuration>
      hibernate.cfg.xml
  7. Create a class for Data access as shown below
    public class DAO {
    public static List getData() {
    SessionFactory sessionFactory = new Configuration().configure().buildSessionFactory();
    Session session = sessionFactory.getCurrentSession();
    List result = null;
    try {
    session.beginTransaction();
    result = session.createQuery("from Employee").list();
    session.getTransaction().commit();
    } catch (Exception e) {
    e.printStackTrace();
    }
    return result;
    }
    }
    DAO.java
Running this example on tomcat shows the Emp table data in a table with 4 records per page, as set in the pagesize attribute of the display:table tag.

{ 0 comments... Views All / Send Comment! }

Post a Comment