Pagination Preview Pic

Pagination in Oracle WebCenter Content Presenter

TekTalkBlogHeader

Pagination in Oracle WebCenter Content Presenter

By: Suresh Vuray

Business Problem:

Recently, I came across a requirement to do pagination in a Content Presenter.

The business use case is to display a list of content items (Site Studio Data files) as a list of items on a page.  It can be achieved easily using the Content Presenter taskflow, assigning a list of items (multi-list or query based) and use a multi-list Content Presenter.  That works fine until the content grows and the number of items increase to more than a few (say more than 10). When the number of items increases, it affects the usability (user will have to scroll down a long page of content to find what they need) and the response times of the page (especially on pages with a lot of traffic as the number of lookups in WCC increases and the page size grows).

This customer has a few “Archive” pages in the portal, where the user will be able to dig up an old “News” article, a “Publication” or some other form of site studio based content. A quick Google search pointed out a few ways to achieve pagination in a Content Presenter using a bean for persisting the pagination data such as page index, page size, etc. However, that would require custom library development, deployment, downtime, restarts, etc.

TekStream Solution:

Application Development Framework (ADF) Basic Table Component comes to the rescue. One of the new features of 11.1.1.7 is pagination in tables.  ADF Basic Table can be used as an iterator to loop thru the items restored by the list of items and pagination can be enabled by changing the following properties of the af:table component

  • autoHeightRows=0
  • scrollPolicy=”page”
  • fetchsize=5 – fetchsize property sets the items per page. In this example it is set to 5.
  • value=#{nodes} – where nodes is the list of items
  • var=”node”

<af:table id=”cpTable” value=”#{nodes}” var=”node”                  

       scrollPolicy=”page” autoHeightRows=”0″ fetchSize=”5″

</af:table>

af:column component(s) can be added to the af:table to display the node property data. In the example below a single item template is used but multiple columns and standard adf component can also be used to get desired display of content.

<af:table id=”cpTable” value=”#{nodes}” rowBandingInterval=”0″ var=”node”                         

        scrollPolicy=”page” autoHeightRows=”0″ fetchSize=”5“>

        <af:column id=”cpColumn1″>

                        <dt:contentTemplate  id=”singleItemTemplate” ”

                                        node=”#{node} nodesHint=”#{nodes}”

                                        view=”content.templates.singleItem” />

                </af:column>
</af:table>

You may need to set nowrap=false property on the af:column component to achieve display of single item in a single / multiple lines as desired.

However, ADF Basic Table component is developed for displaying typical database table data, hence it has some specific properties enabled by default and these need to be disabled appropriately.

  • disableColumnReordering=”true”
  • columnSelection=”none”
  • rowSelection=”none”
  • columnResizing=”disabled”
  • contentDelivery=”lazy”
  • contextMenuSelect=”false”
  • horizontalGridVisible=”false”
  • verticalGridVisible=”false”

<af:table id=”cpTable” value=”#{nodes}” rowBandingInterval=”0″ var=”node”                 

        scrollPolicy=”page” autoHeightRows=”0″ fetchSize=”5″                        

      disableColumnReordering=”true” columnSelection=”none” rowSelection=”none”   

      columnResizing=”disabled” contentDelivery=”lazy” contextMenuSelect=”false”                           

      horizontalGridVisible=”false” verticalGridVisible=”false” >

        <af:column id=”cpColumn1″>

                        <dt:contentTemplate  id=”singleItemTemplate” ”

                                        node=”#{node} nodesHint=”#{nodes}”

                                        view=”content.templates.singleItem” />

                </af:column>
</af:table>

pagination 11

Skinning the af:table component will allow us to modify/remove the unnecessary elements of the pagination. Below is one such variation.

pagination 22

This approach improves portal page response time, especially for retrieving and presenting a large list of Site Studio based web assets from Oracle WebCenter Content.

First Name*

Last Name*

Email*

Phone