advanced for each loop - XSLT

Kasper Dyrvig 246 posts 379 karma points

Sep 06, 2011 @ 15:26

Advanced for-each loop

This is in addition to jQuery tools scrollable - can it be done?

This is a little more complecated...

<xsl:param name="currentPage"/>
<xsl:variable name="productFeedUrl">http://xml.example.com/searchresult.ashx?productgroup=79415</xsl:variable>
<xsl:variable name="groupsize" select="5" />

<xsl:template match="/">
  <div id="products">
    <xsl:for-each select="umbraco.library:GetXmlDocumentByUrl($productFeedUrl)//Product">
      <xsl:choose>
        <xsl:when test="ProductInfoUrl != ''">
          <xsl:variable name="productFeed" select="umbraco.library:GetXmlDocumentByUrl(ProductInfoUrl)"/>
          <xsl:choose>
            <xsl:when test="$productFeed != ''">
              <xsl:apply-templates select="$productFeed/ProductInfoList/*[position() mod $groupsize = 1]" mode="group" />
            </xsl:when>
            <xsl:otherwise>
              This product could not be found
            </xsl:otherwise>
          </xsl:choose>
        </xsl:when>
        <xsl:otherwise>
          There are no products
        </xsl:otherwise>
      </xsl:choose>
    </xsl:for-each>
  </div>
</xsl:template>
    
<xsl:template match="ProductInfo" mode="group">
  <div class="row">
    <xsl:apply-templates select=". | following-sibling::ProductInfo[position() &lt; $groupsize]" mode="item" />
  </div>
</xsl:template>
    
<xsl:template match="ProductInfo" mode="item">
  <div class="item">
    <a href="{ProductURL}" class="itemImage"><img src="{AboutProduct/ProductImage/PicBig}" alt="Image"/></a>
    <p><a href="{ProductURL}"><xsl:value-of select="AboutProduct/SubHeadLine"/></a></p>
    <a href="{ProductURL}" class="itemPrice">Date: <xsl:value-of select="umbraco.library:FormatDateTime(Dates/Date[1], 'd. MMM.')"/><br /><span><xsl:value-of select="PricePrefix"/>&nbsp;<xsl:value-of select="Price"/><xsl:value-of select="umbraco.library:GetDictionaryItem('Price ending')"/></span></a>
    <a href="{ProductURL}" class="itemButton">Buy to day</a>
  </div>
</xsl:template>

This works but the productItems are wrapped wrong.

The output is:

<div id="products">
  <div class="row">
    <div class="item"> [data] </div>
  </div>
  <div class="row">
    <div class="item"> [data] </div>
  </div>
</div>

But I want this:

<div id="products">
  <div class="row">
    <div class="item"> [data] </div>
    <div class="item"> [data] </div>
    <div class="item"> [data] </div>
    <div class="item"> [data] </div>
    <div class="item"> [data] </div>
  </div>
</div>

I have puzzled with it for some hours now, but can't calculate the currect solution... help will be appreseated.

Copy Link

Dirk De Grave 4541 posts 6021 karma points MVP 3x admin c-trib

Sep 06, 2011 @ 15:36

you'll have to move the <div class="row"></div> out of the ProductInfo template and put it just after the for-each or just before, depending on whether you need to have a row for each product or just a single row div for all products.

<xsl:template match="/">
  <div id="products">
    <div class="row">
    <xsl:for-each select="umbraco.library:GetXmlDocumentByUrl($productFeedUrl)//Product">
      <div class="row">
      <xsl:choose>
        <xsl:when test="ProductInfoUrl != ''">
          <xsl:variable name="productFeed" select="umbraco.library:GetXmlDocumentByUrl(ProductInfoUrl)"/>
          <xsl:choose>
            <xsl:when test="$productFeed != ''">
              <xsl:apply-templates select="$productFeed/ProductInfoList/*[position() mod $groupsize = 1]" mode="group" />
            </xsl:when>
            <xsl:otherwise>
              This product could not be found
            </xsl:otherwise>
          </xsl:choose>
        </xsl:when>
        <xsl:otherwise>
          There are no products
        </xsl:otherwise>
      </xsl:choose>
      </div>
    </xsl:for-each>
    </div>
  </div>
</xsl:template>
    
<xsl:template match="ProductInfo" mode="group">
    <xsl:apply-templates select=". | following-sibling::ProductInfo[position() &lt; $groupsize]" mode="item" />
</xsl:template>
    
<xsl:template match="ProductInfo" mode="item">
  <div class="item">
    <a href="{ProductURL}" class="itemImage"><img src="{AboutProduct/ProductImage/PicBig}" alt="Image"/></a>
    <p><a href="{ProductURL}"><xsl:value-of select="AboutProduct/SubHeadLine"/></a></p>
    <a href="{ProductURL}" class="itemPrice">Date: <xsl:value-of select="umbraco.library:FormatDateTime(Dates/Date[1], 'd. MMM.')"/><br /><span><xsl:value-of select="PricePrefix"/> <xsl:value-of select="Price"/><xsl:value-of select="umbraco.library:GetDictionaryItem('Price ending')"/></span></a>
    <a href="{ProductURL}" class="itemButton">Buy to day</a>
  </div>
</xsl:template>

Cheers,

/Dirk

Copy Link

Kasper Dyrvig 246 posts 379 karma points

Sep 07, 2011 @ 08:08

Thanks Dirk.

I need a row for every 5 product. So I guess I need a bit more modification...

Copy Link

Kasper Dyrvig 246 posts 379 karma points

Sep 07, 2011 @ 08:29

Hey! I solved it! Wohoo! :-)

The solution is: Gather the productfeeds in one variable and then output the data up to 5 items at a time.

The code:

<xsl:param name="currentPage"/>
<xsl:variable name="productFeedUrl">http://xml.example.com/searchresult.ashx?productgroup=79415</xsl:variable>
<xsl:variable name="groupsize" select="5" />
<xsl:variable name="supernodes">
  <Products>
    <xsl:for-each select="umbraco.library:GetXmlDocumentByUrl($productFeedUrl)//Product">
      <xsl:choose>
        <xsl:when test="ProductInfoUrl != ''">
          <xsl:copy-of select="umbraco.library:GetXmlDocumentByUrl(ProductInfoUrl)/ProductInfoList/ProductInfo"/>
        </xsl:when>
        <xsl:otherwise></xsl:otherwise>
      </xsl:choose>
    </xsl:for-each>
  </Products>
</xsl:variable>
<xsl:variable name="superdata" select="make:node-set($supernodes)" />

<xsl:template match="/">
  <div id="products">
    <xsl:apply-templates select="$superdata/Products/*[position() mod $groupsize = 1]" mode="group" />
  </div>
</xsl:template>
    
<xsl:template match="ProductInfo" mode="group">
  <div class="row">
    <xsl:apply-templates select=". | followng-sibling::ProductInfo[position() &lt; $groupsize]" mode="item" />
  </div>
</xsl:template>
    
<xsl:template match="ProductInfo" mode="item">
  <div class="item">
    <a href="{ProductURL}" class="itemImage"><img src="{AboutProduct/ProductImage/Pic80}" alt="Billede"/></a>
    <p><a href="{ProductURL}"><xsl:value-of select="AboutProduct/SubHeadLine"/></a></p>
    <a href="{ProductURL}" class="itemPrice">Date: <xsl:value-of select="umbraco.library:FormatDateTime(Dates/Date[1], 'd. MMM.')"/><br /><span><xsl:value-of select="PricePrefix"/>&nbsp;<xsl:value-of select="Price"/><xsl:value-of select="umbraco.library:GetDictionaryItem('Price ending')"/></span></a>
    <a href="{ProductURL}" class="itemButton">Buy to day</a>
  </div>
</xsl:template>

Now it works perfect!

Copy Link

is working on a reply...

Flag this post as spam?

Advanced for-each loop