Archive

Posts Tagged ‘Grouping using XSLT in SharePoint 2013’

Adding expand/collapse using XSLT in SharePoint 2013

June 18, 2015 Leave a comment

Hi,

There is a scenario to add expand/collapse functionality in the Business Data Connectivity Webpart

which pulls the data from SQL.

In the BDC webpart we can customize the look & feel using XSL Editor.

In XSL create your own template as given,


<xsl:template name=”CustomRowview”>
<tr id=”group0{generate-id()}”>
<td class=”ms-gb” colspan=”99″ style=”width:100%”>
               <a onclick=”javascript:ExpGroupBy(this);return false;” href=”javascript:”>
               <img border=”0″ name=”expand” alt=”expand” src=”/_layouts/images/plus.gif”/>
               </a>
               <xsl:value-of select=”@Last_Name” disable-output-escaping=”yes”/>,
               <xsl:value-of select=”@First_Name” disable-output-escaping=”yes”/>
</td>
</tr>

<tr style=”display:none;”>
<td style=”width: 50%; height: 20px”>
<table><tbody>

<tr>
<td><span style=”margin-left:5px;”>Item1:</span>
<xsl:value-of select=”@Item1Value” disable-output-escaping=”yes” /></td>

</tr>

<tr>
<td><span style=”margin-left:5px;”>Item2:</span>
<xsl:value-of select=”@Item2Value” disable-output-escaping=”yes” /></td>

</tr>

</tbody>

</table>

</td>

</tr>

</xsl:template>


where,

ExpGroupBy(this) – internal javascript function called for expand/collapse.

Then you can call your newly created custom template in place of default template as given,

<xsl:for-each select=”$Rows”>
<xsl:if test=”position() &gt;= $FirstRow and position() &lt;= $LastRow”>
<xsl:call-template name=”CustomRowview” />
</xsl:if>
</xsl:for-each>

Reference:

http://sympmarc.com/2010/11/05/adding-expandcollapse-logic-to-your-data-view-web-parts-dvwps-the-easy-way/