This article describes how to display random items using XSLT in Data view web part in SharePoint 2010. I assume that the reader is aware of how to add a data view web part and read items from SharePoint list or library.

Requirement:

Generally on a web site, we would like to display the head shots of all people associated with the organization. In addition, we do not want the people icons displayed to be in the same order always. We would like visitors to see the order of people icons displayed to be refreshed every time the page is hit.

Pre-requisites:

Knowledge of using Data view web part connected to a list/ library in SharePoint 2010

Solution:

Create an asset library

1. Create an asset library
2. Upload the requisite images of same dimension in this library

Insert Data View web part using SharePoint Designer


1. Insert a Data View web part using SharePoint Designer
2. Connect this web part to the asset library created above
3. Set the data view to display all items from the library

How to randomize the order of the items

1. XSLT has a function viz. ddwrt:Random
2. The items are traversed using for-each in XSLT code as below:

<xsl:for-each select="$Rows">
    <xsl:call-template name="dvt_1.rowview" />
</xsl:for-each>

3. Add ‘xsl:sort’ for the items as shown below:

<xsl:for-each select="$Rows">
    <xsl:sort select="ddwrt:Random(1, $RowCount)" order="ascending"/>
    <xsl:call-template name="dvt_1.rowview" />
</xsl:for-each>

4. In the above code, ‘$RowCount’ refers to the total number of items present in the list
5.  Now, your order of display of items will change each time the page is refreshed
6. You can change the rendering to display images and modify the UI accordingly
7. This will resolve the issue of displaying items in random order using XSLT in Data View web part

“I hope that this post will allow you to resolve the issue of displaying random items from list/ library. Provide your feedback to help me improve my blog :)”