I had a request to create the typical content rating system you see on the web but for Sharepoint 2007-the catch? I needed to deploy as a site template that could be deployed easily by site collection owners.
What did I come up with you ask?
First, it’s amazing what the new aggregate data sources in Sharepoint 2007 and x-path can do:)
You can use the new linked datasouces to access data in other lists, web services, and even SQL sources.
Then using X-path, XSL, javascript, and customizing the dataview web-part you have some options for doing interesting things in site templates that you might not have thought about before or would immediately consider server-side code a requirement.
The Approach
Displaying the ratings from within your list/document library.
The basic approach is to tie your custom list to a second list that stores the rating using a common id. You can use javascript for this.
Then on your custom list use an x-path query to get a handle to the rows you want and then render the star rating appropriately.
Warning: I haven’t provided all the steps here and there are a few to getting the different parts of the solution connected and working together-this example covers only the bare essentials of displaying the ratings from within your list/document library but should get you off to a good start.
Coming in Part 2: The custom XSL for displaying data on the view ratings page.
Coming in Part 3: Pre-populating the ratings fields and filtering the results set by adding parameters to the aggregate datasource select query.
Coming in Part 4: How to configure a datasource to be easily deployed as part of a site template deployed within a site collection on a different server.
Displaying the aggregated rating for a specific list item or document:
Once I linked to the list where I stored all my ratings it was a matter of building an x-path query to aggregate data from the ratings list in order to display my star ratings in the custom list:
From the row item template on a custom list contained with a DVWP in XSLT format:
<xsl:template name="dvt_1.rowview">
<xsl:param name="ParentPath" />
<xsl:param name="SrcPos" />
<xsl:variable name="dvt_1ParentRow" select="current()" />
<xsl:variable name="FilteredRatedQuestions" select="../../../Call_Question_Ratings/Rows/Row[@QuestionID=$dvt_1ParentRow/@ID]" />
Once I had a handle to a proper rowset then I could perform whatever calculations I deem necessary to display the appropriate star ratings:
In my scenario a five star rating based on a simple average sufficed and used the images already available in the layouts directory.
<xsl:choose>
<xsl:when test="
../../../Call_Question_Ratings/Rows/Row/@QuestionID=$dvt_1ParentRow/@ID">
<xsl:variable name="dvt_1RowRating" select="format-number(sum(
$FilteredRatedQuestions/@Rating)div (@_x0023_Rated), "###0.0;-###0.0")"/>
<xsl:if test="$dvt_1RowRating >= ‘2’ and $dvt_1RowRating < ‘3’">
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
</xsl:if>
<xsl:if test="$dvt_1RowRating >= ‘3’ and $dvt_1RowRating < ‘4’">
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
</xsl:if>
<xsl:if test="$dvt_1RowRating >= ‘4’ and $dvt_1RowRating < ‘5’">
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
</xsl:if>
<xsl:if test="$dvt_1RowRating >= ‘5’ and $dvt_1RowRating < ‘6’">
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
<img src="\_layouts\images\addtofavorites.gif" border="0" align="absmiddle"/>
</xsl:if>
</xsl:when>
<xsl:otherwise>
<img src="\_layouts\images\addtofavorites.gif" border="0"/>
</xsl:otherwise>
</xsl:choose>
Cheers!
