Gorgo.Live.ToString()

Mariusz, Gorzoch tech Blog

Content query web part enhancements

leave a comment »

This time it gonna be a short story about some improvments you can easy do for "Content query web part" (CQWP). I came across those needs during development I was asked for one application. The requirements was to build a way to present 10 recent modified document by anyone in entire site collection. During this work I stuck with two issues, which I would like to present here. Those issues are:
 
1. Change color of the alternative rows so they will have diffrent color then the normal ones. With little experiances around CQWP you will find out that this can not be done, by simple atributes tweak-up. To do so, you need to go to ItemStyle.xsl and build your own new template. If you need such a functionality try to use this template:
 
 <xsl:template name="AlternateItems" match="Row[@Style=’AlternateItems’]" mode="itemstyle">
  <xsl:param name="CurPos" />
        <xsl:variable name="SafeLinkUrl">
            <xsl:call-template name="OuterTemplate.GetSafeLink">
                <xsl:with-param name="UrlColumnName" select="’LinkUrl’"/>
            </xsl:call-template>
        </xsl:variable> 
        <xsl:variable name="DisplayTitle">
            <xsl:call-template name="OuterTemplate.GetTitle">
                <xsl:with-param name="Title" select="@Title"/>
                <xsl:with-param name="UrlColumnName" select="’LinkUrl’"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="LinkTarget">
            <xsl:if test="@OpenInNewWindow = ‘True’" >_blank</xsl:if>
        </xsl:variable>
  <xsl:variable name="BgColor12">          
   <xsl:choose>               
    <xsl:when  test="($CurPos mod 2 = 0)">
     <xsl:value-of select="’white’" />
    </xsl:when>
    <xsl:otherwise>
     <xsl:value-of select="’whitesmoke’" />
    </xsl:otherwise>
   </xsl:choose> 
  </xsl:variable>

        <div id="linkitem" class="item link-item">   
            <xsl:call-template name="OuterTemplate.CallPresenceStatusIconTemplate"/>
   <table width="100%" bgColor="{$BgColor12}" cellpadding="0" cellspacing="0">
    <tr>
     <td width="3%"><xsl:value-of select="$CurPos" /></td>
     <td width="6%" align="center"><xsl:value-of select="@CTLawyersDocumentFolderDocNoField"/></td>
     <td align="left">
      <a href="{$SafeLinkUrl}" target="{$LinkTarget}" title="{@LinkToolTip}">
       <xsl:value-of select="$DisplayTitle"/>
      </a>   
     </td> 
    </tr>
   </table>
  </div>
 </xsl:template> 
 
the most importent part is the variable "BgColor12", which is responsible for recalculating if the current row is alternate one or not. In addition, to make this work you need to go to "ContentQueryMain.xsl" file, check it out and find definition of template "OuterTemplate.CallItemTemplate". This template deffinition need to be tweak-up by adding new "when" statement like this one:
 
 <xsl:when test="@Style=AlternateItems">
    <xsl:apply-templates select="." mode="itemstyle">
      <xsl:with-param name="CurPos" select="$CurPosition" />
   </xsl:apply-templates>
 </xsl:when> 
 
This tells to CQWP engine to pass a parameter to our template with the number of current processing row.
After those two changes, please check-in both files. When you check them in, you can go to your "Content query web part" and change the Item style, to be the "AlternativeItems" (this option will pop-up automaticly as we created definition of it in itemstyle.xsl).
 
Done, if you have done everything right, then you should get your list with alternative background colors:
 
 
2. Force "Content query web part" to show link to the document properties, insted of to the document itself. Out of the box, when you ask CQWP to get some items for you, he will provide you the list, where you can find some fields containing URL to the document. The problem is that those links are poiting directly to the document itself and not to the "Properties" of the item. After fighting for a while I found solution for that.
 
First you need to export you web part and add few additional field to be taken by the engine. When you export the web part definition, please open it and change the line containing "CommonViewFields" property to looks like this (by default it should be empty):
 
        <property name="CommonViewFields" type="string">FileRef, Lookup;EncodedAbsUrl,Computed</property>
 
This will couse to retrive additional fields during performing query.
Now, save and upload new definition to the web part galery, so you will have new version of your "Content query web part" (the good idea is also to change name of the web part so you will not override the default one).
 
Next, open "ItemStyle.xsl" and go to out custom "AlternateItems" template. Inside it define new variable:
 
  <xsl:variable name="ViewLink">
   <xsl:value-of select="@EncodedAbsUrl" /><xsl:value-of select="substring-before(substring-after(@FileRef,’#’),’/’)"/><xsl:value-of select="’/Forms/DispForm.aspx?ID=’"/><xsl:value-of select="substring-before(@FileRef,’;’)"/>
  </xsl:variable>
 
and let use it, somewhere in "DIV" section, like so:
 
   <table width="100%" bgColor="{$BgColor12}" cellpadding="0" cellspacing="0">
    <tr>
     <td width="3%"><xsl:value-of select="$CurPos" /></td>
     <td width="6%" align="center"><xsl:value-of select="@CTLawyersDocumentFolderDocNoField"/></td>
     <td align="left">
      <a href="{$ViewLink}" target="{$LinkTarget}" title="{@LinkToolTip}">
       <xsl:value-of select="$DisplayTitle"/>
      </a>   
     </td> 
    </tr>
   </table>
 
Done. Now you need to upload new version of "ItemStyle.xsl" file, check it in, and apply the "AlternateItems" style to you web part (created based on the web part definition uploaded before). If you do so, then from now on, when you click on the document name you will be redirected to the document details page insted to document (attachment) itself.
 
those things also can be really ease done with use of Enhancement content query web part.
 
Usefull resources:
 
Advertisements

Written by Mariusz Gorzoch

13 July 2009 at 16:21

Posted in SharePoint

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: