Quick and easy: Embed a hyperlink into data view web part XSLT

UPDATE (01/17/08): This blog entry talks about more hyperlink XSL goodness: http://www.sharepointsecurity.com/blog/sharepoint/sharepoint-2007-development/rewriting-links-in-search-results-xslt.

Overview and Objective: I had created a simple bar chart to serve as component on a dashboard.  I’ll save the details on building charts for another post, but I did not invent that technique (nor the question mark, for that matter).  It turned out there was a bug in the chart and while I fixed that, I took the opportunity to convert some labels into hyperlinks that pointed at the underlying list behind the graph.  For example, there is a label with value "Hold".  I wanted to turn the label into a hyperlink so that the user could click on it and drill down to the specific entries in the list whose status value is "Hold".

Steps:

  1. Use visual studio for sharepoint-aware intellisense.
  2. Copy the DVWP’s XSLT into visual studio (create a blank project, add an XSL file to the project).
  3. Copy the link you want to use into the clipboard.
  4. Paste it into the right location in the XSL.
  5. Convert URL argument separators on the query string from "&" to "&"
  6. Url-encode individual arguments.
  7. Wrap that inside an <a href…> </a>

Example:

I have an URL:

http://[server]/[site]/Lists/Open%20Positions/AllItems.aspx?View={84EEA2F5-121B-40B7-946F-0FA704A1DAA1}&FilterField1=Recruiter&FilterValue1=Hold

I convert it into:

     <a href="Lists/Open%20Positions/AllItems.aspx?View=%7b84EEA2F5-121B-40B7-946F-
0FA704A1DAA1%7d&amp;FilterField1=Recruiter&amp;FilterValue1=Hold"> Hold: </a>

I have manually transformed the first argument from:

{84EEA2F5-121B-40B7-946F-0FA704A1DAA1}

to:

%7b84EEA2F5-121B-40B7-946F-0FA704A1DAA1%7d

(In this, the open brace transforms to %7b and the closing brace transforms to %7d)

The second and third arguments’ parameters ("FilterField1=Recruiter" and "FilterValue1=Hold" respectively) do not need to be url-encoded because they do not contain any unsafe characters.

Notes:

This technique should generally work anywhere you want to embed a hyperlink in XSLT where the hyperlink includes parameters on the URL such as:

http://[server]/[site]/Lists/Open%20Positions/AllItems.aspx?View={84EEA2F5-121B-40B7-946F-0FA704A1DAA1}&FilterField1=Recruiter&FilterValue1=Hold

I got the URL itself by accessing the custom list and manually filtering on the status column (labeled "Recruiter" above).

6 thoughts on “Quick and easy: Embed a hyperlink into data view web part XSLT

  1. Paul Galvin

    Cristina, that 84EE.. is a GUID that uniquely identifies the list internally. You can get it by pulling up the view in your browser and inspecting the URL of your browser.

    Reply
  2. Cristina Perez Otaiza

    where or how do generate this code ’84EEA2F5-121B-40B7-946F-0FA704A1DAA1′

    Could be possible to do this …&FilterField1=Recruiter Center &FilterValue1=Hold CE / ASM?

    Or
    Do i need to remove the spaces between them?

    Reply
  3. Eric Anderson
    Do you have any suggestions for the situation where you want to pass data from a SharePoint list as the FilterValue1 value, and where the value in the column may contain ampersands?  (I’ve tried numerous ways to encode/escape the value, but am not having a lot of luck in passing it properly.) 
    Reply
  4. Costas Tsaklas
    I saw the example at the Help Desk application in the ‘fab 40’.  The problem I don’t know how it was generated and that’s why I’m looking forward to the steps on how to do it
    Reply
  5. Paul Galvin
    I didn’t invent it, but it’s strange how difficult it is to find.
     
    I came across a functional example of this I think from one of the "fab 40" templates.
     
    It’s data view web part with XSLT that generates a graph.  I definitely plan to do a post on it.
     
    Reply
  6. Costas Tsaklas
    I’m looking forward to the post about creating a chart.  I have been looking for information on how to create charts based on lists (e.g open, closed issues, percentages etc.) and I can’t find any.  Thanks
    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *