Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • syn-rg 282 posts 425 karma points
    Nov 01, 2012 @ 07:05
    syn-rg
    0

    Page results filter reverts to default when navigating between pages

    I've created an image gallery and am using the following filters to sort the results displayed on the page:

    Which works great and filters as expected, until I navigate to another page within the pagination (.aspx?page=2) and the filter reverts to the default options. I need it to save the selected options and displayed the filtered results accordingly.

    Here's a snippet of the XSLT I'm using, if needed I post the entire XSLT:

    <xsl:variable name="FF_sortType" select="umbraco.library:RequestForm('sortType')" />
    <xsl:variable name="FF_resultsPerPage" select="umbraco.library:RequestForm('resultsPerPage')" />      
    <xsl:variable name="FF_details" select="umbraco.library:RequestForm('details')" />    
    <xsl:variable name="FF_zoom" select="umbraco.library:RequestForm('zoom')" /> 
    
    <!-- Filter the page results, Images per page, Most Recent/Alphabetical, Details On/Off, Zoom On/Off -->
    <form action="#">
      <div class="imageGalleryAlbumFilter">
        <fieldset>
          <label>Images per page:</label>
          <select name="resultsPerPage" id="resultsPerPage" onchange="document.getElementById('BoostMasterForm').submit()" >
            <option value="8">
            <xsl:if test="$FF_resultsPerPage= '8'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            8 </option>
            <option value="20">
            <xsl:if test="$FF_resultsPerPage= '20'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            20 </option>
            <option value="40">
            <xsl:if test="$FF_resultsPerPage= '40'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            40 </option>
            <option value="60">
            <xsl:if test="$FF_resultsPerPage= '60'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            60 </option>
            <option value="80">
            <xsl:if test="$FF_resultsPerPage= '80'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            80 </option>
            <option value="100">
            <xsl:if test="$FF_resultsPerPage= '100'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            100 </option>
          </select>
        </fieldset>
        <fieldset>
          <label>Sort by:</label>
          <select name="sortType" id="sortType" onchange="document.getElementById('BoostMasterForm').submit()" >
            <option value="MostRecent">
            <xsl:if test="$FF_sortType= 'MostRecent'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            Most recent </option>
            <option value="Alphabetical">
            <xsl:if test="$FF_sortType= 'Alphabetical'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            Alphabetical </option>
          </select>
        </fieldset>
        <fieldset>
          <label>Details:</label>
          <select name="details" id="details" onchange="document.getElementById('BoostMasterForm').submit()" >
            <option value="On">
            <xsl:if test="$FF_details= 'On'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            On </option>
            <option value="Off">
            <xsl:if test="$FF_details= 'Off'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            Off </option>
          </select>
        </fieldset>
        <fieldset>
          <label>Zoom:</label>
          <select name="zoom" id="zoom" onchange="document.getElementById('BoostMasterForm').submit()" >
            <option value="On">
            <xsl:if test="$FF_zoom= 'On'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            On </option>
            <option value="Off">
            <xsl:if test="$FF_zoom= 'Off'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            Off </option>
          </select>
        </fieldset>
      </div>
    </form>
    <script type='text/javascript'>
    $(document).ready(function() {
        $("#resultsPerPage").change(function() {
            $("#BoostMasterForm").attr("action", $(this).val());
            $("#BoostMasterForm").submit();
        });
        $("#sortType").change(function() {
            $("#BoostMasterForm").attr("action", $(this).val());
            $("#BoostMasterForm").submit();
        });
        $("#details").change(function() {
            $("#BoostMasterForm").attr("action", $(this).val());
            $("#BoostMasterForm").submit();
        });
        $("#zoom").change(function() {
            $("#BoostMasterForm").attr("action", $(this).val());
            $("#BoostMasterForm").submit();
        });
    });
    </script>

    If anyone can help it would be greatly appreciated.

    Cheers, JV

  • syn-rg 282 posts 425 karma points
    Nov 08, 2012 @ 06:10
    syn-rg
    0

    I was suggested the following:

    The umbraco.library static class has a bunch of helpers for managing session & other variables. As you are navigating using a querystring, the form is not submitted, and your controls inside XSLT do not have viewstate - the ability to retain their values between page submissions.

    There are two ways around this:

    1. Re-code your gallery (or your filter section) as an ASP.NET usercontrol, and enable viewstate on the controls;
    2. When changing the form values, manually build a string in Javascript that contains the name and value of each control (or, save the values into a cookie with Javascript). Then, when paginating, either tack the Javascript string on the end of your querystring and retrieve the values usingumbraco.library:RequestQueryString("myparam")in you XSLT, or retrieve the values from the cookies usingumbraco.library.RequestCookies("myparam")to then determine which form options need making as "selected" when rendering your<select>options.

    I'm not sure how to do either. But would prefer the second option.

    Also my page template has a form wrapping the content.

    So I do not want a nested form. But removing the form from my filter XSL code, causes the filter to only work for a few changes. After a couple of changes it no longer filters. What should I do?

  • Chriztian Steinmeier 2798 posts 8787 karma points MVP 7x admin c-trib
    Nov 08, 2012 @ 09:08
    Chriztian Steinmeier
    0

    Hi JV,

    The best solution to this, is to switch your form to use GET instead, and make your pagination code use the full QueryString and just replace the "page" parameter when switching pages. That way, it's also possible to bookmark a specific page in a setting.

    I have a PaginationHelper XSLT file here which you can either use, or have look at for insight on how to achieve this.

    /Chriztian

  • syn-rg 282 posts 425 karma points
    Nov 23, 2012 @ 06:12
    syn-rg
    0

    Thanks Chriztian, I'll need help with doing that I think.

    I had a look at your PaginationHelper, looks like it could help with this particular issue. But once again I'll need some help with it.

    I'm posting my full code here in case anyone can help me out, would be great appreciated:

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE xsl:stylesheet [ <!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" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets" xmlns:PS.XSLTsearch="urn:PS.XSLTsearch" 
        exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets PS.XSLTsearch ">
      <xsl:output method="xml" omit-xml-declaration="yes" />
      <xsl:param name="currentPage"/>
    
      <xsl:variable name="FF_sortType" select="umbraco.library:RequestForm('sortType')" />
      <xsl:variable name="FF_resultsPerPage" select="umbraco.library:RequestForm('resultsPerPage')" />        
      <xsl:variable name="FF_details" select="umbraco.library:RequestForm('details')" />    
      <xsl:variable name="FF_zoom" select="umbraco.library:RequestForm('zoom')" />    
      <xsl:variable name="FF_pageUI" select="umbraco.library:RequestForm('pageUI')" />     
    
      <!-- DICTIONARY parameters for localization. Use default (English) text if dictionary item does not exist or has no value -->
      <xsl:variable name="dictionaryButton-Search" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Button-Search')), 'Search')"/>
      <xsl:variable name="dictionaryDescription-Context" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Description-Context')), 'Context')"/>
      <xsl:variable name="dictionaryDescription-ContextUnavailable" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Description-ContextUnavailable')), 'unavailable')"/>
      <xsl:variable name="dictionaryHeading-SearchResults" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Heading-SearchResults')), 'Search Results')"/>
      <xsl:variable name="dictionaryNavigation-Next" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Navigation-Next')), 'Next')"/>
      <xsl:variable name="dictionaryNavigation-Previous" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Navigation-Previous')), 'Previous')"/>
      <xsl:variable name="dictionaryPageRange-ShowingResults" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]PageRange-ShowingResults')), 'Showing results')"/>
      <xsl:variable name="dictionaryPageRange-To" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]PageRange-To')), 'to')"/>
      <xsl:variable name="dictionaryScore-Score" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Score-Score')), 'score')"/>
      <xsl:variable name="dictionaryStats-PagesIn" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Stats-PagesIn')), 'pages in')"/>
      <xsl:variable name="dictionaryStats-ImagesIn" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Stats-ImagesIn')), 'images in')"/>
      <xsl:variable name="dictionaryStats-Searched" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Stats-Searched')), 'Searched')"/>
      <xsl:variable name="dictionaryStats-Seconds" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Stats-Seconds')), 'seconds')"/>
      <xsl:variable name="dictionarySummary-Matches" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Summary-Matches')), 'matches')"/>
      <xsl:variable name="dictionarySummary-NoMatchesWereFoundFor" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Summary-NoMatchesWereFoundFor')), 'No matches were found for')"/>
      <xsl:variable name="dictionarySummary-Page" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Summary-Page')), 'page')"/>
      <xsl:variable name="dictionarySummary-Pages" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Summary-Pages')), 'pages')"/>
      <xsl:variable name="dictionarySummary-Image" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Summary-Image')), 'image')"/>
      <xsl:variable name="dictionarySummary-Images" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Summary-Images')), 'images')"/>
      <xsl:variable name="dictionarySummary-YourSearchFor" select="PS.XSLTsearch:getDictionaryParameter(string(umbraco.library:GetDictionaryItem('[XSLTsearch]Summary-YourSearchFor')), 'Your search for')"/>
    
      <!-- Results per page -->
      <xsl:variable name="resultsPerPage">
          <xsl:choose>
              <xsl:when test="$FF_resultsPerPage"><xsl:value-of select="$FF_resultsPerPage" /></xsl:when>
              <xsl:otherwise>8</xsl:otherwise>
          </xsl:choose>
      </xsl:variable>
    
      <xsl:variable name="page" select="umbraco.library:RequestQueryString('page')" />
    
      <!-- Input the documenttype you want here -->
      <xsl:variable name="documentTypeAlias" select="string('ImageGalleryPhoto')"/>
      <xsl:template match="/">
      <form id="BoostMasterForm" method="post">
      <xsl:variable name="matchedNodes" select="$currentPage/descendant::* [name() = $documentTypeAlias and string(umbracoNaviHide) != '1']" />
      <xsl:variable name="nodeCount" select="count($matchedNodes)" />
      <xsl:if test="$nodeCount &gt; 0">
        <xsl:variable name="page">
        <xsl:choose>
          <!-- first page -->
          <xsl:when test="number(umbraco.library:RequestQueryString('page')) &lt;= 1 or string(umbraco.library:RequestQueryString('page')) = '' or string(number(umbraco.library:RequestQueryString('page'))) = 'NaN'">
            <xsl:value-of select="number('1')" />
          </xsl:when>
          <!-- last page -->
          <xsl:when test="number(umbraco.library:RequestQueryString('page')) &gt; $nodeCount div $resultsPerPage">
            <xsl:value-of select="ceiling($nodeCount div $resultsPerPage)" />
          </xsl:when>
          <!-- the value specified in the url -->
          <xsl:otherwise>
            <xsl:value-of select="number(umbraco.library:RequestQueryString('page'))"/>
          </xsl:otherwise>
        </xsl:choose>
        </xsl:variable>
        <xsl:variable name="startMatch" select="($page - 1) * $resultsPerPage + 1" />
        <xsl:variable name="endMatch">
        <xsl:choose>
          <!-- all the rest (on the last page) -->
          <xsl:when test="($page * $resultsPerPage) &gt; $nodeCount">
            <xsl:value-of select="$nodeCount" />
          </xsl:when>
          <!-- only the appropriate number for this page -->
          <xsl:otherwise>
            <xsl:value-of select="$page * $resultsPerPage" />
          </xsl:otherwise>
        </xsl:choose>
        </xsl:variable>
        <xsl:choose>
          <xsl:when test="count($currentPage/descendant::* [name() = $documentTypeAlias and string(umbracoNaviHide) != '1']) &gt; 0">
    
      <div class="imageGalleryAlbumFilter">
        <fieldset>
          <label>Images per page:</label>
          <select name="resultsPerPage" id="resultsPerPage" onchange="document.getElementById('BoostMasterForm').submit()" >
            <option value="8">
            <xsl:if test="$FF_resultsPerPage= '8'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            8 </option>
            <option value="20">
            <xsl:if test="$FF_resultsPerPage= '20'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            20 </option>
            <option value="40">
            <xsl:if test="$FF_resultsPerPage= '40'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            40 </option>
            <option value="60">
            <xsl:if test="$FF_resultsPerPage= '60'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            60 </option>
            <option value="80">
            <xsl:if test="$FF_resultsPerPage= '80'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            80 </option>
            <option value="100">
            <xsl:if test="$FF_resultsPerPage= '100'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            100 </option>
          </select>
        </fieldset>
        <fieldset>
          <label>Sort by:</label>
          <select name="sortType" id="sortType" onchange="document.getElementById('BoostMasterForm').submit()" >
            <option value="MostRecent">
            <xsl:if test="$FF_sortType= 'MostRecent'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            Most recent </option>
            <option value="Alphabetical">
            <xsl:if test="$FF_sortType= 'Alphabetical'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            Alphabetical </option>
          </select>
        </fieldset>
        <fieldset>
          <label>Details:</label>
          <select name="details" id="details" onchange="document.getElementById('BoostMasterForm').submit()" >
            <option value="On">
            <xsl:if test="$FF_details= 'On'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            On </option>
            <option value="Off">
            <xsl:if test="$FF_details= 'Off'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            Off </option>
          </select>
        </fieldset>
        <fieldset>
          <label>Zoom:</label>
          <select name="zoom" id="zoom" onchange="document.getElementById('BoostMasterForm').submit()" >
            <option value="On">
            <xsl:if test="$FF_zoom= 'On'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            On </option>
            <option value="Off">
            <xsl:if test="$FF_zoom= 'Off'">
              <xsl:attribute name="selected">selected</xsl:attribute>
            </xsl:if>
            Off </option>
          </select>
        </fieldset>
      </div>
    
    <script type='text/javascript'>
    $(document).ready(function() {
        $("#resultsPerPage").change(function() {
            $("#BoostMasterForm").attr("action", $(this).val());
            $("#BoostMasterForm").submit();
        });
        $("#sortType").change(function() {
            $("#BoostMasterForm").attr("action", $(this).val());
            $("#BoostMasterForm").submit();
        });
        $("#details").change(function() {
            $("#BoostMasterForm").attr("action", $(this).val());
            $("#BoostMasterForm").submit();
        });
        $("#zoom").change(function() {
            $("#BoostMasterForm").attr("action", $(this).val());
            $("#BoostMasterForm").submit();
        });
    });
    </script>
            <!-- DIV CONTAINER AND UL -->
              <div class="imageGalleryAlbum">
                  <ul>
                      <xsl:if test="$matchedNodes">
                          <xsl:apply-templates select="$matchedNodes">
                              <xsl:sort select="@createDate[$FF_sortType = 'MostRecent' or $FF_sortType='']"  order="descending" />
                              <xsl:sort select="@nodeName[$FF_sortType = 'Alphabetical' or $FF_sortType='']"  order="ascending" />
                              <xsl:with-param name="startMatch" select="$startMatch" />
                              <xsl:with-param name="endMatch" select="$endMatch" />
                          </xsl:apply-templates>
                      </xsl:if>
                  </ul>
              </div>
            </xsl:when>
          </xsl:choose>
    
        <!-- PAGE NUMBERS -->
        <xsl:if test="$nodeCount &gt; $resultsPerPage">
          <xsl:call-template name="pagination">
            <xsl:with-param name="page" select="$page" />
                    <xsl:with-param name="matchedNodes" select="$matchedNodes" />
          </xsl:call-template>
        </xsl:if>
      </xsl:if>
      </form>
      </xsl:template>
      <xsl:template match="*[@isDoc]">
        <xsl:param name="startMatch" />
        <xsl:param name="endMatch" />
        <xsl:if test="position() &gt;= $startMatch and position() &lt;= $endMatch">
          <!-- LIST ITEM CONTENT HERE -->
            <li>
                <xsl:if test="position() mod 4 &gt; 0">
                    <xsl:attribute name="class">image_1_3</xsl:attribute>
                </xsl:if>
                <xsl:if test="position() mod 4 = 0">
                    <xsl:attribute name="class">image_4</xsl:attribute>
                </xsl:if>
                <xsl:choose>
                    <xsl:when test="$FF_zoom = 'Off'"></xsl:when>
                    <xsl:otherwise>
                        <div>
                            <xsl:if test="position() mod 4 &gt; 0">
                                <xsl:attribute name="class">preview image_1_3</xsl:attribute>
                            </xsl:if>
                            <xsl:if test="position() mod 4 = 0">
                                <xsl:attribute name="class">preview image_4</xsl:attribute>
                            </xsl:if>
                            <table width="100%" border="0" cellspacing="0" cellpadding="0">
                                <tr>
                                    <td class="image_cell"><a href="{umbraco.library:NiceUrl(@id)}"> <img src="{concat(substring-before(umbraco.library:GetMedia(imageGalleryPhoto, 'false')/umbracoFile,'.'), '_thumb_630.jpg')}" />
                                        <xsl:variable name="datediff" select="umbraco.library:DateDiff(umbraco.library:ShortDate(umbraco.library:CurrentDate()), umbraco.library:ShortDate(@createDate), 'm')" />
                                        <xsl:if test="$datediff &lt; (1440 * 30)">
                                            <span>
                                                <xsl:attribute name="class">new</xsl:attribute>
                                                new</span>
                                        </xsl:if>
                                        </a>
                                    </td>
                                    <td class="details_cell"><h3><xsl:value-of select="@nodeName"/></h3>
                                        <xsl:if test="string(imageLicenseType) != ''">
                                            <p><xsl:value-of select="imageLicenseType" /></p>
                                        </xsl:if>
                                        <xsl:if test="string(keywords) != ''">
                                            <p><strong>Description:</strong><br/>
                                                <xsl:value-of select="description"/></p>
                                        </xsl:if>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </xsl:otherwise>
                    </xsl:choose>
                <div class="thumb_div">
                    <a href="{umbraco.library:NiceUrl(@id)}"> <img src="{concat(substring-before(umbraco.library:GetMedia(imageGalleryPhoto, 'false')/umbracoFile,'.'), '_thumb_150.jpg')}" />
                        <xsl:variable name="datediff" select="umbraco.library:DateDiff(umbraco.library:ShortDate(umbraco.library:CurrentDate()), umbraco.library:ShortDate(@createDate), 'm')" />
                        <xsl:if test="$datediff &lt; (1440 * 30)">
                            <span>
                                <xsl:attribute name="class">new</xsl:attribute>
                                new</span>
                        </xsl:if>
                    </a>
                </div>
                <xsl:choose>
                    <xsl:when test="$FF_details = 'Off'"></xsl:when>
                    <xsl:otherwise>
                        <div class="meta_div">
                            <p> <a href="{umbraco.library:NiceUrl(@id)}"> <xsl:value-of select="@nodeName"/> </a> </p>
                            <p><xsl:value-of select="imageLicenseType" /></p>
                        </div>
                    </xsl:otherwise>
                </xsl:choose>
            </li>
         </xsl:if>
      </xsl:template>
    
      <!-- PAGINATION -->
      <xsl:template name="pagination">
        <xsl:param name="page" />
        <xsl:param name="matchedNodes" />
        <xsl:param name="qs" />
        <xsl:param name="listHeader" select="''" />
        <xsl:variable name="pageNumber" >
            <xsl:choose>
                <xsl:when test="umbraco.library:RequestQueryString('page') &lt;= 0 or string(umbraco.library:RequestQueryString('page')) = '' or string(umbraco.library:RequestQueryString('page')) = 'NaN' and (umbraco.library:IsProtected(@id, @path) = false() or umbraco.library:HasAccess(@id, @path) = true())">0</xsl:when>
                <xsl:otherwise>
                    <xsl:value-of select="umbraco.library:RequestQueryString('page')"/>
                </xsl:otherwise>
            </xsl:choose>
        </xsl:variable>
        <xsl:variable name="numberOfRecords" select="count($matchedNodes)"/>
        <xsl:variable name="currentPageNumber" select="$pageNumber" />
        <xsl:variable name="numberOfPages" select="ceiling($numberOfRecords div $resultsPerPage)" />
        <div id="page_numbers_nav">
          <ul>
            <!-- previous page -->
            <xsl:if test="$page &gt; 1">
              <li class="pager-prev"><a class="previous" href="{concat('?page=', $page - 1, $qs)}" title="Previous page">&#8249;</a></li>
            </xsl:if>
    
            <!-- each paged set of results is listed, with a link to that page set -->
            <xsl:call-template name="pageNumbers">
              <xsl:with-param name="pageIndex" select="1" />
                        <xsl:with-param name="page" select="$page" />
                        <xsl:with-param name="matchedNodes" select="$matchedNodes" />
                        <xsl:with-param name="qs" select="$qs" />
            </xsl:call-template>
    
            <!-- next page -->
            <xsl:if test="$page * $resultsPerPage &lt; count($matchedNodes)">
              <li class="pager-next"><a class="next" href="{concat('?page=', $page + 1, $qs)}" title="Next page">&#8250;</a></li>
            </xsl:if>
          </ul>
        </div>
          <div class="pageResults">
              <!-- calculate a few handy variables now, for easy access later -->
              <xsl:variable name="startMatch" select="($page - 1) * $resultsPerPage + 1"/>
              <xsl:variable name="endMatch">
                  <xsl:choose>
                      <!-- all the rest (on the last page) -->
                      <xsl:when test="($page * $resultsPerPage) &gt; count($matchedNodes)">
                          <xsl:value-of select="count($matchedNodes)"/>
                      </xsl:when>
                      <!-- only the appropriate number for this page -->
                      <xsl:otherwise>
                          <xsl:value-of select="$page * $resultsPerPage"/>
                      </xsl:otherwise>
                  </xsl:choose>
              </xsl:variable>
              <xsl:if test="count($matchedNodes) &gt; 0">
                  <xsl:value-of select="$dictionaryPageRange-ShowingResults"/>
                  <xsl:text> </xsl:text>
                  <xsl:value-of select="$startMatch"/>
                  <xsl:if test="$startMatch != $endMatch">
                      <xsl:text> </xsl:text>
                      <xsl:value-of select="$dictionaryPageRange-To"/>
                      <xsl:text> </xsl:text>
                      <xsl:value-of select="$endMatch"/>
                  </xsl:if>
              </xsl:if>
              of 
              <xsl:value-of select="$listHeader" />
              <xsl:value-of select="$numberOfRecords" /> images
          </div>
          <form type="get" onchange="return false">
          <div class="pagerUI">
              <table border="0" cellspacing="0" cellpadding="0">
                  <tr>
                      <!-- previous page -->
                      <xsl:if test="$page &gt; 1">
                          <td class="pager-prev"><a class="previous" href="{concat('?page=', $page - 1, $qs)}" title="Previous page">&#8249;</a></td>
                      </xsl:if>
                      <td>Page</td>
                      <td>
                          <input type="number" name="page" id="page" min="1" >
                          <xsl:choose>
                                  <xsl:when test="$page=1">
                                      <xsl:attribute name="value">1</xsl:attribute>
                                  </xsl:when>
                                  <xsl:otherwise>
                                      <xsl:attribute name="value">
                                          <xsl:value-of select="$currentPageNumber" />
                                      </xsl:attribute>
                                  </xsl:otherwise>
                              </xsl:choose>
                              <xsl:attribute name="max">
                                  <xsl:value-of select="$numberOfPages"/>
                              </xsl:attribute>
                          </input>
                      </td>
                      <td>of <xsl:value-of select="$numberOfPages"/></td>
                      <!-- next page -->
                      <xsl:if test="$page * $resultsPerPage &lt; count($matchedNodes)">
                          <td class="pager-next"><a class="next" href="{concat('?page=', $page + 1, $qs)}" title="Next page">&#8250;</a></td>
                      </xsl:if>
                  </tr>
              </table> 
          </div>
          </form>
    
      </xsl:template>
      <xsl:template name="pageNumbers">
        <xsl:param name="page" />
        <xsl:param name="pageIndex" />
        <xsl:param name="matchedNodes" />
        <xsl:param name="qs" />
        <xsl:variable name="distanceFromCurrent" select="$pageIndex - $page"/>
    
        <!-- show a maximum of nine paged sets on either side of the current paged set; just like Google does it -->
        <xsl:if test="($distanceFromCurrent &gt; -6 and $distanceFromCurrent &lt; 6)">
          <xsl:choose>
            <xsl:when test="$pageIndex = $page">
              <li class="pager-current"><span class="currentpage"><xsl:value-of select="$pageIndex" /></span></li>
            </xsl:when>
            <xsl:otherwise>
              <li class="pager-item"><a class="next_page" href="{concat('?page=', $pageIndex, $qs)}" title="Page {$pageIndex}"><xsl:value-of select="$pageIndex" /></a></li>
            </xsl:otherwise>
          </xsl:choose>
        </xsl:if>
    
        <!-- recursively call the template for all the paged sets -->
        <xsl:if test="$pageIndex * $resultsPerPage &lt; count($matchedNodes)">
          <xsl:call-template name="pageNumbers">
            <xsl:with-param name="pageIndex" select="$pageIndex + 1" />
                    <xsl:with-param name="page" select="$page" />
                    <xsl:with-param name="matchedNodes" select="$matchedNodes" />
                    <xsl:with-param name="qs" select="$qs" />
          </xsl:call-template>
        </xsl:if>
      </xsl:template>
    </xsl:stylesheet>

     

Please Sign in or register to post replies

Write your reply to:

Draft