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>
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">
<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).
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.
Related
I have some data that i put in (image, title, text). I ahve 3 different elements in my xslt for each of them:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:udt="DotNetNuke/UserDefinedTable" exclude-result-prefixes="udt">
<xsl:output method="xml" indent="yes" omit-xml-declaration="yes" />
<!--
This prefix is used to generate module specific query strings
Each querystring or form value that starts with udt_{ModuleId}_param
will be added as parameter starting with param
-->
<xsl:variable name="prefix_param">udt_<xsl:value-of select="//udt:Context/udt:ModuleId" />_param</xsl:variable>
<xsl:template match="udt:Data" mode="list">
<xsl:value-of select="udt:Image" disable-output-escaping="yes" />
<xsl:value-of select="udt:Title" disable-output-escaping="yes" />
<xsl:value-of select="udt:Text" disable-output-escaping="yes" />
</xsl:template>
<xsl:template match="/udt:UserDefinedTable">
<xsl:variable name="currentData" select="udt:Data" />
<xsl:if test="$currentData">
<xsl:apply-templates select="$currentData" mode="list">
</xsl:apply-templates>
</xsl:if>
</xsl:template>
<xsl:template name="EditLink">
<xsl:if test="udt:EditLink">
<a href="{udt:EditLink}">
<img border="0" alt="edit" src="{//udt:Context/udt:ApplicationPath}/images/edit.gif" />
</a>
</xsl:if>
</xsl:template>
</xsl:stylesheet>
I want to fill these elements each into its own div group, so my end result would be something like this:
<div id="images">
<!--all images here-->
</div>
<div id="title">
<!--all titles here-->
</div>
<div id="text">
<!--all texts here-->
</div>
Can this be achieved by any kind of grouping or whats the right aproach?
The concept to use xsl:value-of for your 3 element types is wrong,
as this instruction copies only the content of these elements,
without XML markup.
Assuming that the only goal is to reorder (group) your elements,
and they are direct descendants of the current element (udt:Data),
the task can be done the following way:
<xsl:template match="udt:Data">
<xsl:copy>
<div id="images">
<xsl:copy-of select="udt:Image"/>
</div>
<div id="title">
<xsl:copy-of select="udt:Title"/>
</div>
<div id="text">
<xsl:copy-of select="udt:Text"/>
</div>
</xsl:copy>
</xsl:template>
Of course, this is only a template, not the whole script.
Note that e.g. if these elements were located also at "deeper" descendant levels,
all the above XPath expressions should be prececed with descendant::.
And remember about including in your script all namespaces, the script refers to.
They should be declared in stylesheet tag.
I realize that you are really good at programming and that your answers are dependable.
Is it possible for you to assist me in resolving an issue I am having with my xslt code? I'm new to progamming so I would appreciate any assistance I can get.
Your solution in grouping 3 divs in a row is found at the link below, but I do not know how to apply it to my code. I am using Sitecore and I have a div block that corresponds to each page generated to produce metro-like blocks, 3 in a row. So far I generates the desired divs but does not put them three in a row. My code is found below.
XSLT How can I wrap each 3 elements by div?
I would appreciate any help I can get.
<?xml version="1.0" encoding="UTF-8"?>
<!--=============================================================
File: ServicesFeatureblocks.xslt
Created by: sitecore\admin
Created: 3/27/2013 11:50:57 AM
Copyright notice at bottom of file
==============================================================-->
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:sc="http://www.sitecore.net/sc"
xmlns:dot="http://www.sitecore.net/dot"
exclude-result-prefixes="dot sc">
<!-- output directives -->
<xsl:output method="html" indent="no" encoding="UTF-8" />
<!-- parameters -->
<xsl:param name="lang" select="'en'"/>
<xsl:param name="id" select="''"/>
<xsl:param name="sc_item"/>
<xsl:param name="sc_currentitem"/>
<!-- variables -->
<!-- Uncomment one of the following lines if you need a "home" variable in you code -->
<xsl:variable name="Services" select="sc:item('/sitecore/content/home/Services',.)" />
<!--<xsl:variable name="home" select="/*/item[#key='content']/item[#key='home']" />-->
<!--<xsl:variable name="home" select="$sc_currentitem/ancestor-or-self::item[#template='site root']" />-->
<!-- entry point -->
<xsl:template match="*">
<xsl:apply-templates select="$sc_item" mode="main"/>
</xsl:template>
<!--==============================================================-->
<!-- main -->
<!--==============================================================-->
<xsl:variable name="group" select="3" />
<xsl:template match="/">
<xsl:apply-templates select="$sc_currentitem[position() mod $group = 1]" />
</xsl:template>
<xsl:template match="item" mode="inner">
<div class="block orange">
<xsl:value-of select="sc:fld('Title',.)" />
</div>
<item/>
</xsl:template>
<xsl:template match="item">
<div>
<xsl:apply-templates
select="./item|following-sibling::services/item[position() < $group]" mode="inner" />
</div>
</xsl:template>
</xsl:stylesheet>
If you can use a sublayout instead of xslt rendering, You can achieve your functionality easily using Listview with GroupTemplate
<asp:ListView ID="listview1" runat="server" GroupItemCount="3" GroupPlaceholderID="groupPlaceholder"
ItemPlaceholderID="itemPlaceholder">
<LayoutTemplate>
<div class="productsContent">
<asp:PlaceHolder ID="groupPlaceholder" runat="server"></asp:PlaceHolder>
</div>
</LayoutTemplate>
<GroupTemplate>
<div class="product-rows">
<asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
</div>
</GroupTemplate>
<ItemTemplate>
<div class="products">
</div>
</ItemTemplate>
</asp:ListView>
I'm looking to get some XSLT (for Umbraco CMS) coded properly and I'm getting kind of stumped. What I'm trying to do is:
Start from a certain node, put each child node into a div; for every 3 children, wrap in a parent div.
Instead of my mess of for-each,choose and when statements, I have tried implementing a apply-template structure but I just can't seem to get the hang of it; so here's my mess of XSLT right now (I'm sure this is bad practice & terrible for performance, but I really don't know what to do at the moment):
<div class="row four">
<h2>Smart Phones see all smart phones →</h2>
<div class="row three"> <!-- This div should be created again for every 3 divs -->
<xsl:for-each select="umbraco.library:GetXmlNodeById('1063')/descendant::*[#isDoc and string(showInMainNavigation) = '1']">
<xsl:choose>
<xsl:when test="position() < 3">
<div class="col">
<a href="{umbraco.library:NiceUrl(./#id)}">
<img class="phonePreviewImg" src="{./previewImage}" style="max-width:117px; max-height:179px;" />
<h4 class="phoneTitle"><xsl:value-of select="./#nodeName" />/h4>
<p class="phonePrice">$<xsl:value-of select="./price" /></p
</a>
</div>
</xsl:when>
<xsl:when test="position() = 3"> <!-- set this div to include class of `omega` -->
<div class="col omega">
<a href="{umbraco.library:NiceUrl(./#id)}">
<img class="phonePreviewImg" src="{./previewImage}" style="max-width:117px; max-height:179px;" />
<h4 class="phoneTitle"><xsl:value-of select="./#nodeName" />/h4>
<p class="phonePrice">$<xsl:value-of select="./price" /></p
</a>
</div>
</xsl:when>
</xsl:choose>
</xsl:for-each>
</div> <!-- End Row Three -->
</div> <!-- End Row Four -->
Obviously this code does not produce the "wrap every three". Can anyone shed some light on what I need to do to accomplish this?
UPDATE - improved the answer
I cannot think of an elegant solution using templates, but this clunky one with a loop works:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template name="render">
<xsl:param name="node"/>
<xsl:param name="last"/>
<div>
<xsl:if test="$last">
<xsl:attribute name="class">
<xsl:text>omega</xsl:text>
</xsl:attribute>
</xsl:if>
<xsl:value-of select="$node"/>
</div>
</xsl:template>
<xsl:template match="/*">
<root>
<xsl:variable name="nodes" select="*[not(#skip)]"/>
<xsl:for-each select="$nodes">
<xsl:if test="(position() mod 3)=1">
<xsl:variable name="position" select="position()"/>
<div>
<xsl:call-template name="render">
<xsl:with-param name="node" select="."/>
<xsl:with-param name="last" select="false()"/>
</xsl:call-template>
<xsl:if test="$nodes[$position+1]">
<xsl:call-template name="render">
<xsl:with-param name="node" select="$nodes[$position+1]"/>
<xsl:with-param name="last" select="false()"/>
</xsl:call-template>
</xsl:if>
<xsl:if test="$nodes[$position+2]">
<xsl:call-template name="render">
<xsl:with-param name="node" select="$nodes[$position+2]"/>
<xsl:with-param name="last" select="true()"/>
</xsl:call-template>
</xsl:if>
</div>
</xsl:if>
</xsl:for-each>
</root>
</xsl:template>
</xsl:stylesheet>
applied to:
<root>
<node>1</node>
<node skip="1">to be skipped</node>
<node>2</node>
<node>3</node>
<node skip="1">to be skipped</node>
<node skip="1">to be skipped</node>
<node>4</node>
<node skip="1">to be skipped</node>
<node>5</node>
<node>6</node>
<node>7</node>
<node skip="1">to be skipped</node>
</root>
produces:
<root>
<div>
<div>1</div>
<div>2</div>
<div class="omega">3</div>
</div>
<div>
<div>4</div>
<div>5</div>
<div class="omega">6</div>
</div>
<div>
<div>7</div>
</div>
</root>
You need to replace the select used to set the $nodes variable the XPath selecting the nodes you want, and the render template with the code needed to generate the result you need for each node.
As simple and short as this:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output omit-xml-declaration="yes" indent="yes"/>
<xsl:strip-space elements="*"/>
<xsl:template match="num[position() mod 3 = 1]">
<div>
<xsl:apply-templates mode="inGroup"
select=".|following-sibling::*[not(position() >2)]"/>
</div>
</xsl:template>
<xsl:template match="num" mode="inGroup">
<p><xsl:apply-templates mode="inGroup"/></p>
</xsl:template>
<xsl:template match="text()"/>
</xsl:stylesheet>
When this transformation is applied on the following XML document:
<nums>
<num>01</num>
<num>02</num>
<num>03</num>
<num>04</num>
<num>05</num>
<num>06</num>
<num>07</num>
<num>08</num>
<num>09</num>
<num>10</num>
</nums>
the wanted, correct result is produced:
<div>
<p>01</p>
<p>02</p>
<p>03</p>
</div>
<div>
<p>04</p>
<p>05</p>
<p>06</p>
</div>
<div>
<p>07</p>
<p>08</p>
<p>09</p>
</div>
<div>
<p>10</p>
</div>
Here's an elegant solution using templates.
When this XSLT:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output omit-xml-declaration="yes" indent="yes" />
<xsl:strip-space elements="*" />
<xsl:param name="pNumInGroup" select="3" />
<xsl:template match="/*">
<html>
<xsl:apply-templates select="*[position() mod $pNumInGroup = 1]" />
</html>
</xsl:template>
<xsl:template match="node">
<div>
<xsl:for-each
select=".|following-sibling::*[not(position() > $pNumInGroup - 1)]">
<div>
<xsl:apply-templates />
</div>
</xsl:for-each>
</div>
</xsl:template>
</xsl:stylesheet>
...is applied to the sample XML provided by #MiMo:
<root>
<node>1</node>
<node>2</node>
<node>3</node>
<node>4</node>
<node>5</node>
<node>6</node>
<node>7</node>
</root>
...the correct result is produced:
<html>
<div>
<div>1</div>
<div>2</div>
<div>3</div>
</div>
<div>
<div>4</div>
<div>5</div>
<div>6</div>
</div>
<div>
<div>7</div>
</div>
</html>
If the parameter value is changed to 5:
<xsl:param name="pNumInGroup" select="5" />
...the correct result is still produced:
<html>
<div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
</div>
<div>
<div>6</div>
<div>7</div>
</div>
</html>
Explanation:
We define a pNumInGroup parameter at the top of the document (with a default value of 3). This is useful, as it allows the XSLT to be used more flexibly (i.e., if you need a different number of <div> elements per group, simply pass them as a parameter).
The first template matches the root node, recreates it, and tells the XSLT processor to apply templates to the first element of each grouping (here's a refresher in modular arithmetic in case you need it).
The second template matches the <node> elements that are selected by the previous template. For each, a new <div> element is created and populated with the remaining items appropriate to that wrapped group.
NOTE: I generally stay away from <xsl:for-each> unless I really need it; in the case of the last template, I don't really need it (I could just as easily have specified the wrapping/secondary <div> logic with another template). However, for the sake of "crispness" and not over-templating the XSLT, I chose this route.
Here's my template:
<xsl:template name="rec">
<xsl:for-each select="*">
<div class="{local-name()}">
<xsl:for-each select="#*">
<xsl:attribute name="data-{local-name()}">
<xsl:value-of select="."/>
</xsl:attribute>
</xsl:for-each>
<xsl:value-of select="text()" />
<xsl:call-template name="rec" />
</div>
</xsl:for-each>
</xsl:template>
Given a document like so:
<test>
<item value="1">Item 1 Text</item>
<item value="2">Item 2 Text</item>
</test>
The above transform will turn it into:
<div class="test">
<div class="item" data-value="1">Item 1 Text</div>
<div class="item" data-value="2">Item 2 Text</div>
</div>
The problem I'm having, is that this transform doesn't respect text nodes properly, and I don't have enough background with XSLT to figure out how to fix it. Here's the problem: given xml like so:
<para>This is a <emphasis>paragraph</emphasis> people!</para>
I would like to see the following output:
<div class="para">This is a <div class="emphasis">paragraph</div> people!</div>
The problem is that I'm not getting this - I'm getting this:
<div class="para">This is a <div class="emphasis">paragraph</div></div>
Notice the missing 'people!' text node. How can I fix my XSLT above to provide me with the output I need?
One problem is that
<xsl:value-of select="text()" />
just selects the value of the first child text node, and outputs it.
The easiest way to do this right is probably to use <xsl:apply-templates> instead of <xsl:call-template>.
Then instead of
<xsl:for-each select="*">
and
<xsl:value-of select="text()" />
you can use
<xsl:apply-templates />
which will apply the appropriate template to each child element and text node, in order, not skipping any.
Here is a complete implementation:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<xsl:template match="*">
<div class="{local-name()}">
<xsl:for-each select="#*">
<xsl:attribute name="data-{local-name()}">
<xsl:value-of select="."/>
</xsl:attribute>
</xsl:for-each>
<xsl:apply-templates />
</div>
</xsl:template>
</xsl:stylesheet>
Note the <xsl:apply-templates/>, which operates on all children of the context node, including text nodes, by default in absence of an explicit select attribute.
A default template is used for text nodes. This template simply copies them to the output.
Sample input:
<test>
<item value="1">Item 1 Text</item>
<item value="2">Item 2 Text</item>
<para>This is a <emphasis>paragraph</emphasis> people!</para>
</test>
produces the desired output:
<div class="test">
<div class="item" data-value="1">Item 1 Text</div>
<div class="item" data-value="2">Item 2 Text</div>
<div class="para">This is a <div class="emphasis">paragraph</div> people!</div>
</div>
I'm trying to add the attribute 'selected' to <option>. I've tried various ways and I can't get it working. This is how I'm trying it:
<xsl:for-each select="page/index/values/albums">
<option>
<xsl:attribute name="value"><xsl:value-of select="id" /></xsl:attribute>
<xsl:if test="page/index/values/album = id">
<xsl:attribute name="selected">selected</xsl:attribute>
</xsl:if>
<xsl:value-of select="name" />
</option>
</xsl:for-each>
What is the correct form for the <xsl:if />?
Edit:
My XML file:
<page>
<index>
<values>
<album>2</album>
<albums>
<id>1</id>
<name>Album #1</name>
</albums>
<albums>
<id>2</id>
<name>Album #2</name>
</albums>
</values>
</index>
</page>
Output:
<option value="1">Album #1</option>
<option value="2" selected="selected">Album #2</option>
The XPath you are using is incorrect:
<xsl:if test="page/index/values/album = id">
Is should be:
<xsl:if test="../album = id">
You are in the context of the different albums nodes, so you need to go to the parent node values before getting the value of album.
Alternatively, you need to root your XPath:
<xsl:if test="/page/index/values/album = id">
The test condition should be:
id = ../album
Edit: Now with desired output, use this stylesheet:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="values">
<select>
<xsl:apply-templates select="albums"/>
</select>
</xsl:template>
<xsl:template match="albums">
<option value="{id}">
<xsl:apply-templates/>
</option>
</xsl:template>
<xsl:template match="id"/>
<xsl:template match="id[.=../../album]">
<xsl:attribute name="selected">selected</xsl:attribute>
</xsl:template>
</xsl:stylesheet>
Output:
<select>
<option value="1">Album #1</option>
<option value="2" selected="selected">Album #2</option>
</select>
Your form for adding an attribute is right, but as #Alejandro pointed out, your if test condition is probably wrong. Especially the left side of the "=". These XPath expressions are relative to the context node, which is page/index/values/albums.