Saturday 5 April 2008

Implementing pagination in JSPs

I recently implemented Pagination in my JSPs so that if there were several results returned by a query (Search function), the user could view the results in a page-wise format. The image on the right is what I ended up with after implementing pagination through an open-source tag library, displaytags. In this post I will explain the basic steps that I followed in order to install and use the tag library.

While implementing pagination is not a complex task as there are only a few scenarios that need to be taken care off, I preferred to use a taglib to implement the same. While the web and Google will throw up several solutions, I tried implementing the pager taglib available at JSPTags first.

The pager taglib has several look and feel features available, I was not happy with the documentation and examples provided and after struggling with the installation of the taglib, I gave it up in favor of the displayTags taglib. I found this library easy to install and use, with a good mixture of code examples and features. Needless to say, I was able to achieve my objective.

Here I will show you the basic steps of setting up the pagination feature using the displayTags library in a Struts based JSP that is deployed on a JBOSS server (version 4.04) running on Java 1.5. Okay, lets get started. We will do this in steps.

1.Download the displayTags library (At the time of writing version displaytag-1.1.1.jar is the latest jar). In the download, you will also get a WAR file that you can directly drop into your web-server and view the examples. But for setting the tagLib for your own use, you are best off extracting (unzipping) the WAR and using the files inside.

Extract the displaytag-1.1.1.jar and place it into your WEB-INF/lib directory.
I did not need to add a directive in my web.xml as I am using JSP2.0. (Tomcat 5.5)

You will also need to make sure that the commons-* jars that come with the displayTags download are available in the WEB-INF\lib directory.

2. In your JSP,add the following directive:
<%@ taglib uri="http://displaytag.sf.net" prefix="display" %>

3. You may wish to add the CSS styles available in the downloaded displayTags library. There are several theme css files that can be used and I chose to use the file (displaytag.css). Drop this file into your style sheets directory within your WEB-INF and reference it in your JSP.

Be aware that the data that will be displayed by the tagLibrary will be within a table and sometimes nesting a table within a table (if your JSP has one) can cause display problems but in my case, I had a very simple layout so I was fine.

4. Now add the displayTags that will display the data in a paginated format.
Add the following lines to your JSP:
The table name in this case, requestScope.SEARCH_RESULTS_LIST matches the name of a List that has been placed into the request scope by the servlet (Action class) that forwarded to this JSP. So for this table name to be workable, I have a list that I set in the servlet using the following line of code.

request.setAttribute("SEARCH_RESULTS_LIST", searchResults);

In the list, searchResults, I have a row of String data which is named as searchResultRow (set as the property name in line 6 above). The variable base (on line 1) points to the URL that I want page links to forward to.

Lines 3 and 4 are display properties that you can set to control the look and feel of the paginated data results. A more detailed list of what can be done is available here.
Another feature that is advantageous is that data that is presented in a grid layout can have sortable column headers. In other words, clicking on a column will sort the data displayed on the page.

Well, thats it. Build and Deploy your application and if all goes well, you'll have pagination going with no problems. This is what my page looked like, after I finished.





1 comment:

Anonymous said...

It is useful to try everything in practise anyway and I like that here it's always possible to find something new. :)