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 Previous, Next, First 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>