I am seeking assistance with xsl transformation. The xml generated by SharePoint Server control is as follows:
<rows>
<row>A</row>
<row>B</row>
<row>C</row>
<row>D</row>
<row>E</row>
<row>F</row>
<row>G</row>
<row>H</row>
</rows>
The required transformation of the above xml is as shown below:
<== A-----------B ==> An li sliding back and forth with the help of a slider plugin
C-----------D
E-----------F
G-----------H
JUST LIKE THIS:
(source: imagesup.net)
The necessary HTML format for the slider plugin to function correctly is as follows:
<div class="content-carousel">
<!-- start Basic Jquery Slider -->
<ul class="bjqs">
<li>
<div class="content-left">
<h4>A</h4>
</div>
<div class="content-right">
<h4>B</h4>
</div>
</li>
<li>
<div class="content-left">
<h4>C</h4>
</div>
<div class="content-right">
<h4>D</h4>
</div>
</li>
.
.
</ul>
</div>
Here is the actual raw XML file: https://gist.github.com/4380967
Check out the bjqs slider plugin requirement here:
(source: imagesup.net)
CURRENT PROGRESS: Although I have managed to achieve a two-column layout, it involves using table rows which generates unnecessary markup that is not suitable for the slider plugin. Here's what I have done for each row:
<xsl:if test="$CurPos = 1 ">
<xsl:text disable-output-escaping="yes"><div><table></xsl:text>
</xsl:if>
<xsl:if test="$CurPos mod 2 = 1">
<xsl:text disable-output-escaping="yes"><tr></xsl:text>
</xsl:if>
<li>
<td width="50%" valign="top">
<table width="90%">
<tr height="35px" min-height="35px" valign="top">
<td>
<span>
<xsl:if test="string-length($SafeImageUrl) != 0">
<div class="image-area-left">
<a href="{$SafeLinkUrl}" target="{$LinkTarget}">
<img class="image" src="{$SafeImageUrl}" alt="{@ImageUrlAltText}" />
</a>
</div>
</xsl:if>
<H3>
<a href="{$SafeLinkUrl}"> <xsl:value-of select="@Title"/> </a>
</H3>
<div class="newsgist"><xsl:value-of select="substring(@Comments,0,200)"/>
<xsl:if test="string-length(@Comments) > 200">…</xsl:if> <a href="{$SafeLinkUrl}"> Details…</a>
</div>
</span>
</td>
</tr>
</table>
</td></li>
<xsl:if test="$CurPos mod 2 = 0">
<xsl:text disable-output-escaping="yes"></tr></xsl:text>
</xsl:if>
<xsl:if test="$CurPos = $LastRow ">
<xsl:text disable-output-escaping="yes"></table></div></xsl:text>