Display Tag Pagination, Sorting Illustration Inwards Jsp As Well As Servlet

If y'all are a Java programmer, writing JSP pages for your spider web application too doesn't know much most JavaScript, jQuery, CSS too HTML, thence display tag is best for creating dynamic tables, pagination, sorting, too exporting information into PDF, Word too Excel format. Display tag is a JSP tag library, where code is written inwards Java but y'all tin exercise them similar HTML tags e.g. <display></display> . Though display tag is one-time library, I lead keep ever used inwards JSP for displaying tabular data. It comes amongst sample CSS as well, which is expert plenty for many applications. Long fourth dimension back, I lead keep shared roughly display tag tips too example, too many of my reader asked me to write most how to exercise pagination too sorting inwards JSP page.

I haven't genuinely got run a peril to piece of job on JSP after that, thence it took me thence long to portion this display tag pagination too sorting example tutorial.

Anyway, In this tutorial nosotros volition non alone larn most pagination too sorting but also larn how to display multiple tables using display tag inwards 1 JSP file.

There is a non-obvious detail, which tin problem y'all if y'all are also similar many programmers, who write code past times copying, including me :).

If y'all exercise roughly other tabular array past times simply copying the tabular array already exists inwards page, it may non work, until y'all retrieve to furnish 2 dissimilar ids or uids. In absence of unique identifier similar this, whatever pagination or sorting action on 1 tabular array volition also disturb other table.

So ever retrieve to furnish unique id or uid to each table, created past times display tag inwards same page.

Display Tag Pagination too Sorting Example

Here is our JSP page to display 2 dynamic tables using display tag.  <display:table>  tag is used exercise tables, while <display:column> tag is used exercise columns. You tin brand a column sortable past times specifying attribute sortable="true" , y'all tin define equally many column equally y'all like. If number of column is configurable, y'all tin fifty-fifty exercise foreach tag from JSTL to loop through configuration information too exercise columns. Another of import attribute is pagesize="5" , which defines how many rows each page volition contain, if your information laid has to a greater extent than rows than specified past times this attribute, thence it volition seem inwards adjacent page. You tin exercise this attribute to control pagination inwards your application. Normally y'all should expire along size thence that it tin accept at-least 3/4th of page too residuum tin live on used for other controls.   There is roughly other attribute of display tabular array tag, export, which is used to command export functionality. If y'all laid this attribute equally export=true thence display tag volition demo export selection for the table, which allows y'all to export information inwards pdf, csv, xml and excel format.  For simplicity reason, I lead keep used scriptlet to generate information too populate into list, which volition live on provided to display tag using a session orbit attribute. You should non exercise Java code within JSP inwards production code, instead all your code to generate information should reside inwards model classes or Servlets. Our starting fourth dimension tabular array read information from sessionscope.players attribute too instant tabular array read information from sessionscope.stars attribute, which is genuinely List implementations, ArrayList inwards our case.
   
dependency: 
1) display tag library
2) JSTL meat tag library

You tin download display tag from http://displaytag.sf.net website, too it comes amongst all internal dependency e.g. JARs required for creating PDF document or  iText library, Microsoft give-and-take too excel document back upwards using Apache POI library too others. I am also using CSS files similar displaytag.css, which comes along display tag examples, if y'all download the JAR.

<%@page import="java.util.ArrayList"%>

<%@page import="com.web.revision.Contact"%>

<%@page import="java.util.List"%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<%@ taglib prefix="display" uri="http://displaytag.sf.net" %>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

    "http://www.w3.org/TR/html4/loose.dtd">

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <title>Display tag Pagination too Sorting Example inwards JSP</title>

        <link rel="stylesheet" href="css/displaytag.css" type="text/css">

        <link rel="stylesheet" href="css/screen.css" type="text/css">

        <link rel="stylesheet" href="css/site.css" type="text/css">

    </head>

    <body>

        <%

            List<Contact> players = new ArrayList<Contact>();

            players.add(new Contact("Virat", 98273633, "Mohali"));

            players.add(new Contact("Mahendara", 98273634, "Ranchi"));

            players.add(new Contact("Virender", 98273635, "Delhi"));

            players.add(new Contact("Ajinkya", 98273636, "Jaipur"));

            players.add(new Contact("Gautam", 98273637, "Delhi"));

            players.add(new Contact("Rohit", 98273638, "Mumbai"));

            players.add(new Contact("Ashok", 98273639, "Kolkata"));

            players.add(new Contact("Ravi", 98273640, "Chennai"));

            session.setAttribute("players", players);

            

            List<Contact> stars = new ArrayList<Contact>();

            stars.add(new Contact("Shahrukh", 98273633, "Delhi"));

            stars.add(new Contact("Sallu", 98273634, "Ranchi"));

            stars.add(new Contact("Roshan", 98273635, "Delhi"));

            stars.add(new Contact("Devgan", 98273636, "Jaipur"));

            stars.add(new Contact("Hashmi", 98273637, "Delhi"));

            stars.add(new Contact("Abraham", 98273638, "Mumbai"));

            stars.add(new Contact("Kumar", 98273639, "Kolkata"));

            stars.add(new Contact("Shetty", 98273640, "Chennai"));

           

            session.setAttribute("stars", stars);

        %>

        <div id='tab1' class="tab_content" style="display: block; width: 100%">

            <h3>Display tag Pagination too Sorting Example</h3>

            <p>This is FIRST TABLE </p>

            <display:table name="sessionScope.players" pagesize="5"

                           export="true" sort="list" uid="one">

                <display:column property="name" title="Name"

                                sortable="true" headerClass="sortable" />

                <display:column property="contact" title="Mobile"

                                sortable="true" headerClass="sortable" />

                <display:column property="city" title="Resident"

                                sortable="true" headerClass="sortable" />

            </display:table>

        </div>

       

        <div id='tab2' class="tab_content" style="width: 100%">

            <h3>Table 2</h3>

            <p>This is SECOND TABLE</p>

            <display:table name="sessionScope.stars" pagesize="5"

                           export="false" sort="list" uid="two">

                <display:column property="name" title="Name"

                                sortable="true" headerClass="sortable" />

                <display:column property="contact" title="Mobile"

                                sortable="true" headerClass="sortable" />

                <display:column property="city" title="Resident"

                                sortable="true" headerClass="sortable" />

            </display:table>

        </div>

    </body>

</html>

Output
Here is how your JSP volition hold off like, when displayed equally HTML inwards client's browser :

First tabular array is showing that full viii tape exists, 5 of them is displayed inwards electrical current page, too y'all lead keep 1 to a greater extent than page amongst iii records. See pagination links inwards locomote past times left. There are iii column on each tabular array too they are sortable, piddling icon denotes on which gild they are sorted e.g. ascending or descending. By the way, if y'all desire to back upwards database pagination, y'all demand to write pagination query, equally shared inwards my article Oracle 10g Pagination SQL query. You tin click whatever column to form table. On bottom portion of starting fourth dimension table, y'all lead keep export options for CSV, Excel, XML, PDF and RTF format, instant tabular array doesn't lead keep those options because export attribute is imitation for that.

That's all on this display tag pagination too sorting example. You tin play amongst sorting too pagination now. click Next too Last links to run across number of adjacent page too terminal page, click on header links to form rows based upon that parameter e.g. clicking on Name column volition form whole tabular array on name, clicking on Mobile will form the listing on mobile numbers. Display tag also allows y'all to apply sorting alone on electrical current page or whole result.

Further Learning
Spring Framework 5: Beginner to Guru
Java Web Fundamentals By Kevin Jones
JSP, Servlets too JDBC for Beginners: Build a Database App