How-To implement Pagination in Liferay

 

Liferay provides  a rich set of tag libraries that can help in implementing certain complex functionalities like search container, pagination etc.,  with few lines of code. In this blog let’s see how we can implement the same.
 
For the demo purposed I used the following technical platform,
  •   Liferay Portal v6.1.CE (beta)
  •  Liferay Portal SDK v6.1.CE
  •  Apache Ant  1.8.2
  •  RHEL 6.1 (Windows could also be used)
  •  Eclipse IDE 3.7.1 with Liferay IDE

Use case

This demo uses a very simple use case of displaying 200 list items of type ListItemModel, the ListItemModel is the model class as shown below,
 
ListItemModel.java
 
 
This model class holds the item its id, name and description.  The application will build a Portlet that will display the Model List items with pagination as shown below,
 
PaginationDemoPortlet
 
 
 
The user should be able to paginate across 200 records with 10 records on each page with  PreviousNextFirst and  Last options.

Implementation

To achieve the use case the application uses a small DAO utility class called Pagination Utility, this class will help in Querying for the records from the back end (here its mock objects), the PaginationUtlity class has only one method called getListItems(int  n) that will return ‘ n’ list items. The PaginationUtility class is shown below,
 
PaginationUtility.java
 
 
The following steps shows how to implement the Pagination using  liferay-ui  [1] tag, typically the code of the view page.
 
  1. The first and fore most step is to define the pagination container, the liferay-ui 1tag provides a the search-container1 tag which could be used to initialize the container
<liferay-ui:search-container emptyResultsMessage="there-are-no-items" delta="10">
Parameter
Description
emptyResultsMessage
Used to display the message to the user when no records are found, a resource bundle key could be specified for internationalization
 
delta
the default number of items that needs to be displayed on the page
 
  1. The next step is to manipulate  the result and set the same in pageContext of the JSP page, this is done using the liferay-ui’s search-container-results1,  when manipulating the result we need to set the following pageContext variables to enable the Liferay-ui tag to process and display them,
a.        results – the variable that will hold the subList of the entire result set with its start determined by searchContainer.getStart() and end determined by searchContainer.getEnd(), where  searchContainer is an implicit variable available to the page context after Step #1
b.       total – The total result set size , in our case 200
<liferay-ui:search-container-results>
                                <%
                                                List<ListItemModel> tempResults = PaginationUtil
                                                                                                                .getListItems(200);
                                                                                results = ListUtil.subList(tempResults,
                                                                                                                searchContainer.getStart(),
                                                                                                                searchContainer.getEnd());
                                                                                total = tempResults.size();
                                                                                 pageContext.setAttribute("results", results);
                                                                                 pageContext.setAttribute("total", total);
                                %>
</liferay-ui:search-container-results>
 
  1. The third step of the implementation is to define the result row which is done using the liferay-ui’s search-container-row  tag, this tag takes the following parameters,
 
Parameter
Description
className
The model class that is contained in the result set returned by the PaginationUtil
 
keyProperty
The primary key or unique key property that will be used or passed to various actions
modelVar
The temporary variable where the current resultset object will be stored, typically an instance of  className
 
<liferay-ui:search-container-row
                                 className="com.accenture.icos.demo.portlets.ListItemModel"
                                 keyProperty="id"  modelVar="listItemModel">
 
  1.  The fourth step of the implementation is to define the columns that will be displayed in the resulting table, this is done using the liferay-ui’s search-container-column-text[1]  this tag takes the following two properties,
Parameter
Description
name
The HTML name attribute for the table column
 
property
The model property form which the value of the column needs to be set
 
<liferay-ui:search-container-column-text  name="id"  property="id" />
 
  1. The last and final step of the implementation is to define the paginator element of the results which will help in navigating across pages typically First, Next, Previous, Last etc.,  this is done using the liferay-ui’s  search-container-row[1]
</liferay-ui:search-container-row>
 
[1]  The tag libraries used above also take certain other parameters, which can be used on need basis for further details please consult the Liferay TLD documentation
 
Blogs

The last element should be <liferay-ui:search-iterator /> instead of </liferay-ui:search-container-row>