Sorting by selectbox in XSLT

Question

I have this selectbox on a site Im currently building and what I want to do, is sort a list of items displayed on the page by the value that's being selected. The problem is that I got different kinds of data types, e.g. location and price. If I want to sort on location, no problem it sorts perfectly on alphabetic order of the location names. But if I sort on the 'Low budget', which is from low to high in price, I have to add additional tags to the sort (data-type="number"). That works fine, but then the location and such aren't working anymore.

How to solve this to make it handle all kinds of different data types?

My XSLT:

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:exsl="http://exslt.org/common"
    extension-element-prefixes="exsl">

<xsl:param name="url-filter" select="'recommended'" />

<xsl:template name="resort-list" match="data/resorts/entry">
    <form name="sort-form" action="{$root}/resorts/" method="get">
            <select name="filter" onChange="document.getElementById('sort-form').submit();">
                <option value="">Sort By...</option>
                <option value="recommended">Recommended</option>
                <option value="location">Location</option>
                <option value="prices-from">Low budget</option>
                <option value="prices-till">High budget</option>
            </select>
    </form>

      <xsl:for-each select="data/resorts/entry">
         <!-- this is were I sort the items --> 
         <xsl:sort select="*[name() = $url-filter]" />
        <a href="{$root}/koh-lipe-resorts/resort-view/{resort-name/@handle}">
                    <h3 class="resort-item-heading grey"><xsl:value-of select="resort-name"/></h3>
                    <p> 
                        <xsl:call-template name="truncate">
                            <xsl:with-param name="value" select="resort-description" />
                            <xsl:with-param name="length" select="150" />
                        </xsl:call-template>
                    </p>
        </a>
     </xsl:for-each>
</xsl:template>

<xsl:include href="../utilities/master.xsl"/>
</xsl:stylesheet>

My XML:

<data>
    <events />
    <resorts>
        <pagination total-entries="11" total-pages="2"
        entries-per-page="10" current-page="1" />
        <section id="9" handle="resorts">Resorts</section>
        <entry id="114">
            <price-from handle="1200">1200</price-from>
            <price-till handle="1900">1900</price-till>
            <recommended>No</recommended>
            <lipe-green-aware-resort>No</lipe-green-aware-resort>
            <name>Baja Resort</name>
            <location>Sunrise Beach</location>
        </entry>
    </resorts>
</data>

Answer 1

Good question. Here's a way to do it:

• Create a named template for your inner <a> element, call it "link" for example.
• Create two named templates for your sorted for-each: "sort-by-alpha" and "sort-by-number".
• "sort-by-number" does a for-each, sorts by number, and calls the "link" template.
• "sort-by-alpha" does a for-each, sorts (by alpha), and calls the "link" template.
• In your outer template, outside of where you currently have for-each on data/resorts/entry, put a choose-when-test-otherwise that decides to call "sort-by-number" when the sort criterion is prices-from or prices-till; otherwise, it calls sort-by-alpha.

Does that make sense? Let me know if this doesn't do it for you.

Answer 2

This transformation correctly sorts for each possible parameter value: "recommended" or "price-from":

<xsl:stylesheet version="1.0"
 xmlns:xsl="http://www.w3.org/1999/XSL/Transform"&gt;

 <xsl:param name="url-filter" select="'price-from'" />

 <xsl:variable name="vSortOrder">
  <xsl:choose>
   <xsl:when test="$url-filter = 'price-from'">
    <xsl:text>ascending</xsl:text>
   </xsl:when>
   <xsl:otherwise>descending</xsl:otherwise>
  </xsl:choose>
 </xsl:variable>

 <xsl:variable name="vSortType">
  <xsl:choose>
   <xsl:when test="$url-filter = 'price-from'">
    <xsl:text>number</xsl:text>
   </xsl:when>
   <xsl:otherwise>text</xsl:otherwise>
  </xsl:choose>
 </xsl:variable>

 <xsl:template name="resort-list" match="data/resorts">
    <form name="sort-form" action="/*/resorts/" method="get">
            <select name="filter" onChange="document.getElementById('sort-form').submit();">
                <option value="">Sort By...</option>
                <option value="recommended">Recommended</option>
                <option value="location">Location</option>
                <option value="prices-from">Low budget</option>
                <option value="prices-till">High budget</option>
            </select>
    </form>

      <xsl:for-each select="entry">
         <!-- this is were I sort the items -->
         <xsl:sort select="*[name() = $url-filter]"
          data-type="{$vSortType}" order="{$vSortOrder}" />
        <a href="/*/koh-lipe-resorts/resort-view/{resort-name/@handle}">
                    <h3 class="resort-item-heading grey"><xsl:value-of select="name"/></h3>
        </a>
     </xsl:for-each>
 </xsl:template>

 <xsl:template match="/">
  <html>
   <xsl:apply-templates/>
  </html>
 </xsl:template>
</xsl:stylesheet>

With the this XML document (extending the provided with just one more entry):

<data>
    <events />
    <resorts>
        <pagination total-entries="11" total-pages="2"
        entries-per-page="10" current-page="1" />
        <section id="9" handle="resorts">Resorts</section>
        <entry id="114">
            <price-from handle="1200">1400</price-from>
            <price-till handle="1900">1900</price-till>
            <recommended>No</recommended>
            <lipe-green-aware-resort>No</lipe-green-aware-resort>
            <name>Baja Resort</name>
            <location>Sunrise Beach</location>
        </entry>
        <entry id="115">
            <price-from handle="1500">1500</price-from>
            <price-till handle="1700">1700</price-till>
            <recommended>Yes</recommended>
            <lipe-green-aware-resort>No</lipe-green-aware-resort>
            <name>Blah-Blah Resort</name>
            <location>Blah-Blah Beach</location>
        </entry>
    </resorts>
</data>

and with each of the two possible values of the $url-filter parameter, the correct results are produced sorted with the correct sort-key data type and in the correct sort order (ascending or descending).