Friday, August 27, 2010

Easiest AJAX Pagination on Visualforce

There are two ways of writing a code, the hard way and the best way, Of-course the hard way is the easy way and best way if always hard way. If this sentence seems hard to understand, understand it is for the best.

When developing a VF page, the most important we need is pagination, throwing the large chunk of data on user screen is going to give the user goose bump. After trying a dozen method I came to know the easiest way of implementing pagination using standard set controller on a custom controller.

The demo of the code is available here

The visualforce Page:

<apex:page controller="OpportunityPagination" showheader="false">
<apex:form>
            <apex:pageblock id="ThePageBlock">
                <apex:pageblocktable value="{!opportunities}" var="o">
                    <apex:column value="{!o.name}">
                    <apex:column value="{!o.closedate}">
                </apex:column>
                <apex:panelgrid columns="5">
                        <apex:commandlink action="{!first}" rerender="ThePageBlock"> First</apex:commandlink>
                           <apex:commandlink action="{!previous}" rendered="{!hasPrevious}" rerender="ThePageBlock">  Previous</apex:commandlink>  
                            <apex:outputtext value="Page #{!pageNumber} ">                 
                            <apex:commandlink action="{!next}" rendered="{!hasNext}" rerender="ThePageBlock">Next </apex:commandlink>
                             <apex:commandlink action="{!last}" rerender="ThePageBlock">Last </apex:commandlink>
                     </apex:outputtext>         
            </apex:panelgrid>
           </apex:column>
</apex:pageblocktable>
</apex:pageblock>
</apex:form>
</apex:page>

Apex Controller:

public class OpportunityPagination{ 

    public ApexPages.StandardSetController Con{
        get {
            if(con== null) {
                con= new ApexPages.StandardSetController(Database.getQueryLocator([select name,closedate from Opportunity]));
            }
            con.setPageSize(5);
            return con;
        }
        set;
    }
    
    public List getOpportunities() {
         return (List) con.getRecords();
    }
    
     /*** Pagination control***/
    
     // indicates whether there are more records after the current page set.
    public Boolean hasNext {
        get {
            return con.getHasNext();
        }
        set;
    }
 
    // indicates whether there are more records before the current page set.
    public Boolean hasPrevious {
        get {
            return con.getHasPrevious();
        }
        set;
    }
 
    // returns the page number of the current page set
    public Integer pageNumber {
        get {
            return con.getPageNumber();
        }
        set;
    }
 
    // returns the first page of records
    public void first() {
        con.first();
    }
 
    // returns the last page of records
    public void last() {
        con.last();
    }
 
    // returns the previous page of records
    public void previous() {
        con.previous();
    }
 
    // returns the next page of records
    public void next() {
        con.next();
    }
 
    // returns the PageReference of the original page, if known, or the home page.
    public void cancel() {
        con.cancel();
    }
    
    //    
  
 /*** Pagination control***/
}
Share:

2 comments:

  1. What about return a list of all pages so that the users could click on page 3, 4 etc

    ReplyDelete
    Replies
    1. You could write a maths function for that. You have total number of pages and use function getResultSize() and getPageSize() to determine how many pages are in the list. And I think setpageNumber() should navigate to the desired page number

      Delete