Nibble

Xslt Paging example

Posted April 12, 2008

Default umbraco has a bunch of xslt templates you can choose from when creating a new xslt file, for me about 80% of the time I start from a template and adjust it to my needs. But one thing that is missing is an example of paging, so for those of you who would like to know how to add paging to a list, check out the examples below. To change the number of items displayed just change the recordsPerPage variable. I started from the “list sub pages from current page template” in umbraco and added 2 examples with paging below (one with only a previous and a next link and another example that also adds page numbers).

 

Without paging ( List Sub Pages From Current Page template )

<?xml version=”1.0″ encoding=”UTF-8″?>
<!DOCTYPE xsl:Stylesheet [ &lt;!ENTITY nbsp “&#x00A0;”> ]>
<xsl:stylesheet
version=”1.0″
xmlns:xsl=”http://www.w3.org/1999/XSL/Transform”
xmlns:msxml=”urn:schemas-microsoft-com:xslt”
xmlns:umbraco.library=”urn:umbraco.library”
exclude-result-prefixes=”msxml umbraco.library”>
 
 
<xsl:output method=”xml” omit-xml-declaration=”yes”/>
 
<xsl:param name=”currentPage”/>
 
<xsl:template match=”/”>
 
<!– The fun starts here –>
<ul>
<xsl:for-each select=”$currentPage/node [string(data [@alias=’umbracoNaviHide’]) != ‘1′]”>
<li>
<a href=”{umbraco.library:NiceUrl(@id)}”>
<xsl:value-of select=”@nodeName”/>
</a>
</li>
</xsl:for-each>
</ul>
 
</xsl:template>
 
</xsl:stylesheet>

 

With paging ( previous + next )

<?xml version=”1.0″ encoding=”UTF-8″?>
<!DOCTYPE xsl:Stylesheet [ &lt;!ENTITY nbsp “&#x00A0;”> ]>
<xsl:stylesheet
version=”1.0″
xmlns:xsl=”http://www.w3.org/1999/XSL/Transform”
xmlns:msxml=”urn:schemas-microsoft-com:xslt”
xmlns:umbraco.library=”urn:umbraco.library”
exclude-result-prefixes=”msxml umbraco.library”>
 
 
<xsl:output method=”xml” omit-xml-declaration=”yes”/>
 
<xsl:param name=”currentPage”/>
 
<xsl:template match=”/”>
 
<xsl:variable name=”recordsPerPage” select=”1″/>
 
<xsl:variable name=”pageNumber” >
<xsl:choose>
<!– first page –>
<xsl:when test=”umbraco.library:RequestQueryString(’page’) &lt;= 0 or string(umbraco.library:RequestQueryString(’page’)) = ” or string(umbraco.library:RequestQueryString(’page’)) = ‘NaN’”>0</xsl:when>
<!– what was passed in –>
<xsl:otherwise>
<xsl:value-of select=”umbraco.library:RequestQueryString(’page’)”/>
</xsl:otherwise>
</xsl:choose>
 
</xsl:variable> &nbsp;
 
<xsl:variable name=”numberOfRecords” select=”count($currentPage/node)”/>
 
<!– The fun starts here –>
<ul>
<xsl:for-each select=”$currentPage/node [string(data [@alias=’umbracoNaviHide’]) != ‘1′]”>
<xsl:if test=”position() &gt; $recordsPerPage * number($pageNumber) and
position() &lt;= number($recordsPerPage * number($pageNumber) +
$recordsPerPage )">
<li>
<a href=”{umbraco.library:NiceUrl(@id)}”>
<xsl:value-of select=”@nodeName”/>
</a>
</li>
</xsl:if>
</xsl:for-each>
</ul>
 
<xsl:if test=”$pageNumber &gt; 0″>
<a href=”?page{$pageNumber -1}”>previous </a>
</xsl:if>
 
<xsl:if test=”(($pageNumber +1 ) * $recordsPerPage) &lt; ($numberOfRecords)”>
<a href=”?page={$pageNumber +1}”>next</a>
</xsl:if>
</xsl:template>
 
</xsl:stylesheet>

 

With paging ( previous + page numbers + next )

<?xml version=”1.0″ encoding=”UTF-8″?>
<!DOCTYPE xsl:Stylesheet [ &lt;!ENTITY nbsp “&#x00A0;”> ]>
<xsl:stylesheet
version=”1.0″
xmlns:xsl=”http://www.w3.org/1999/XSL/Transform”
xmlns:msxml=”urn:schemas-microsoft-com:xslt”
xmlns:umbraco.library=”urn:umbraco.library”
exclude-result-prefixes=”msxml umbraco.library”>
 
 
<xsl:output method=”xml” omit-xml-declaration=”yes”/>
 
<xsl:param name=”currentPage”/>
 
<xsl:template match=”/”>
 
<xsl:variable name=”recordsPerPage” select=”1″/>
 
<xsl:variable name=”pageNumber” >
<xsl:choose>
<!– first page –>
<xsl:when test=”umbraco.library:RequestQueryString(’page’) &lt;= 0 or string(umbraco.library:RequestQueryString(’page’)) = ” or string(umbraco.library:RequestQueryString(’page’)) = ‘NaN’”>0</xsl:when>
<!– what was passed in –>
<xsl:otherwise>
<xsl:value-of select=”umbraco.library:RequestQueryString(’page’)”/>
</xsl:otherwise>
</xsl:choose>
 
</xsl:variable> &nbsp;
 
<xsl:variable name=”numberOfRecords” select=”count($currentPage/node)”/>
 
<!– The fun starts here –>
<ul>
<xsl:for-each select=”$currentPage/node [string(data [@alias=’umbracoNaviHide’]) != ‘1′]”>
<xsl:if test=”position() &gt; $recordsPerPage * number($pageNumber) and
position() &lt;= number($recordsPerPage * number($pageNumber) +
$recordsPerPage )">
<li>
<a href=”{umbraco.library:NiceUrl(@id)}”>
<xsl:value-of select=”@nodeName”/>
</a>
</li>
</xsl:if>
</xsl:for-each>
</ul>
 
<xsl:if test=”$pageNumber &gt; 0″>
<a href=”?page{$pageNumber -1}”>previous </a>
</xsl:if>
 
<xsl:call-template name=”for.loop”>
<xsl:with-param name=”i”>1</xsl:with-param>
<xsl:with-param name=”page” select=”$pageNumber +1″></xsl:with-param>
<xsl:with-param name=”count” select=”ceiling(count($currentPage/node)div $recordsPerPage)”></xsl:with-param>
</xsl:call-template>
 
<xsl:if test=”(($pageNumber +1 ) * $recordsPerPage) &lt; ($numberOfRecords)”>
<a href=”?page={$pageNumber +1}”>next</a>
</xsl:if>
</xsl:template>
 
<xsl:template name=”for.loop”>
 
<xsl:param name=”i”/>
<xsl:param name=”count”/>
<xsl:param name=”page”/>
<xsl:if test=”$i &lt;= $count”>
 
<xsl:if test=”$page != $i”>
<a href=”{umbraco.library:NiceUrl($currentPage/@id)}?page={$i - 1}” >
 
<xsl:value-of select=”$i” />
</a>
</xsl:if>
 
<xsl:if test=”$page = $i”>
 
<xsl:value-of select=”$i” />
 
</xsl:if>
 
 
</xsl:if>
<xsl:if test=”$i &lt;= $count”>
<xsl:call-template name=”for.loop”>
<xsl:with-param name=”i”>
<xsl:value-of select=”$i + 1″/>
</xsl:with-param>
<xsl:with-param name=”count”>
<xsl:value-of select=”$count”/>
</xsl:with-param>
<xsl:with-param name=”page”>
<xsl:value-of select=”$page”/>
</xsl:with-param>
</xsl:call-template>
</xsl:if>
</xsl:template>
</xsl:stylesheet>

8 Comments so far

  1. Hartvig on April 16th, 2008

    Cool - great stuff on this blog!

    You’re a core team member with commit access - you should add a paging template to the core (just remember to add an item in the tracker first and associate your commit with the tracker item).

    Cheers,
    Niels…

  2. Tim Geyssens on April 16th, 2008

    Hey Niels,

    Alrighty, I’ll add one to the xslt templates.

    /Tim

  3. Warren Buckley on May 13th, 2008

    Hiya Tim,
    Great post this has just helped me out with some pagination, however I think this would be better if you use 1 instead of 0. As in URLs it makes more common sense to start from page 1 as opposed to page 0.

    For example you dont have page 0 in a book, people are more used to starting from page 1.

    With that said I tried modify the XSLT to do this, without much luck - would you be able to lend a hand?

    //Warren

  4. Anders Burla on August 4th, 2008

    Hi Warren, I have changed the xslt to use page 1 as default cause i needed that as well :)
    Here you go

    <!DOCTYPE xsl:stylesheet [ ]>

    1

     

    1

  5. Berntsen on January 26th, 2009

    Hi Tim!

    Is it possible to download these as xslt-files somewhere? Or could you mail them to me? I’ve been trying to get this to work but without any luck, yet… This is exactly what I’m looking for. :)
    Thanks in advance,
    Berntsen

  6. Yanela Somdaka on November 27th, 2009

    Awesome article man….

    this is sure gonna help me with my current project
    Yanela

  7. Great on April 1st, 2010

    you are great!

  8. Saxon on May 18th, 2010

    Fantastic - this saved me a bucket of time - thank you! Straightforward and elegant.

Leave a Reply