Showing which list items have tags or notes in SharePoint 2010

One of the great areas of functionality added in SharePoint 2010 is Social Feedback – the ability for users to add tags and notes to content as part of the managed metadata service. As has been discussed many times this is a fantastic feature to increase the classification of content and the overall findability of content. The out-of-the-box My Site includes some great features such as the Activity Feed and the Tag Cloud to help surface some of the information captured by tags and notes – and it works really well. One question that was put to me in a recent engagement however was:

How do I see which items in a list or library have tags and notes?

Without selecting each individual item and viewing the tags and notes dialog for each it seems that it’s just not possible. I won’t go into the long discussions we had about the different ways we could surface both the tags and notes information and the context of that information – but I will show you this screenshot of a library which adds a Tags And Notes Column so that at a glance it’s possible to see which items have tags or notes.



The steps to recreate this for a document library are:

1. Create a new column on a library named Tags And Notes
1. The type isn’t actually important, but I used a simple text field
2. Add a web part to a page, e.g. your Team Site home page, and then modify the view to include the newly added column
3. Upload the script (found below) into a suitable location, e.g. the Site Assets library
4. Reference the script in a Content Editor Web Part (CEWP) added to the page

How It Works

What is happening here, is that the CEWP is loading both jQuery and my custom script on a page (the jQuery could/ should obviously be local). The script then goes away and looks for a table on the page that includes a TH cell with the text Tags And Notes in it. If it finds one it goes through each row and puts in the icon for tags and notes into the last column.
Then, it takes the URL of the item in the title column and passes that through to a function which makes a SOAP request to the SharePoint web services to get any tags on that specific URL. The success method then either repeats the process to find comments (if it found no tags) or simply swaps out the source for the tags and notes icon with the source for a has tags and notes icon.
Next steps and Limitations

I’m fairly happy with the result that this script and technique gives, although there are some nagging annoyances. Whilst investigating this I tried to repeat the same behaviour as the Tags And Notes icon found in the ribbon, i.e. it would be nice to be able to click on the icons and view/ add tags and notes for the individual items. Unfortunately I found that by adding in the functions to open up the dialog with multiple instances on a page it would always refer to the first item clicked. I tried various things here like giving unique identifiers but with no success. I’m still looking into this as this is what I’d really like it to do!
Also, I think there’s something in the way that I’m referencing my scripts that is resulting in a javascript error. I’m trying to track this down. No doubt the code could be tidied up in general too, such as by adding a function for the on error event of the ajax call etc.
In terms of next steps this would obviously be a bit of a pain to repeat many times across an environment and so I would be looking to create a custom site column that could simply be added to a list or library to replicate this behaviour. That step may be a bit beyond my basic coding skills though
The Script

Here is the script I used. Hopefully the comments are sufficient to make this readable:

Showing which list items have tags or notes in SharePoint 2010