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 02, 2012 @ 02:28
    syn-rg
    0

    XSLTsearch page navigation using input onchange

    I have created a pagination input that on change will go to the value entered into the input.

    enter image description here

    It will detect the page range and allow navigation between those pages in that range. e.g /image-gallery-album-1.aspx?page=3

    <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>

    However, when I added this to the XSLTSearch code it doesn't work as the URL loses the search string.

    So instead of navigating to: /image-search.aspx?search=football&page=3

    It navigates to: /image-search.aspx?page=3 Which doesn't display any results on that page as it's missing the search criteria to display the search results.

    I tried to change the form and include an "action" that would change the URL to include the search value but I can't include the input value as it's dynamic.

    For example with the below form if I enter any value into the input the URL updates to following: /image-search.aspx?search=otbra&page= It's missing the entered number of the input value.

    Search form with onchange and action and method post attributes:

    <form type="get" onchange="return false">
      <xsl:attribute name="method"> <xsl:text>post</xsl:text> </xsl:attribute>
      <xsl:attribute name="action"> <xsl:text>?search=</xsl:text> <xsl:value-of select="$search"/><xsl:text>&amp;</xsl:text>page= (input value)</xsl:attribute>

    Is there some javascript or some way of detecting the value submitted and parsing it into the search string of the URL?

    Any assistance would be appreciated. Cheers, JV

Please Sign in or register to post replies

Write your reply to:

Draft