Modify ListItem Display to show referencing items…

SharePoint is made up of lists of items, where an item is a set of data. Here is the standard display of an item’s properties:

As you can see, we’ve got a item, and it has some fields of data, and they’re being displayed inside a web part. Those fields are columns on the list:

All very familiar, I’m sure. It gets interesting when we start using Lookup columns, though. These are columns that refer to items in other lists. For example, this is a list of documents, but they refer to items in the above list (that’s what the Item Ref column is doing):

Cool, but wouldn’t it be great if I could show a list of items referring to a particular item on it’s display page? For example, in this case wouldn’t it be good to show a list of ‘Item Documents’ on the DispForm.aspx page used to show the Item’s properties? Well, you can:

(Edit: one of my colleagues points out that Microsoft did this in one of the Fab 40 templates – but I didn’t know).

So how does it work?

Well, the page for showing an item’s properties is just DispForm.aspx. It’s a page in SharePoint, and can be customized in SharePoint Designer. Here is the tree to where it is:

I opened up the page and added a new DataView web part:

As you can see, this is below the web part for showing the item’s properties.

Well, okay, so we have a DataView web part – how do we decide what to show? Looking in the URL for showing an item’s properties, I noticed the ID query string parameter:

Therefore, I set up a Parameter in the DataView Web Part to read in the ID value from the query string:

Then I set up a filter:

This was great – but when I tested it, it didn’t work. The Item Ref wasn’t coming through as it’s ID (e.g. ‘2’) but as it’s value (e.g. ‘Item A’), so comparing against the query string ID value wasn’t working. “Damn”, I thought, “I’m sure there is a way”.

Well, there is – but you can’t do it through the SharePoint Designer design view – instead you have to write code. Looking in the code of the page I found the SPDataSource for the DataView web part:

The SPDataSource is a normal ASP.NET DataSource, albeit for getting data out of SharePoint. I noticed the select command, and wondered if it could be modified by hand to get me the referred to item’s ID. Originally, the Select command looked like this:

This is all on one line and has all sorts of HTML escaping in it – it’s practically unreadable. I converted this to something more readable:

Ah, it’s a CAML query. Not very surprising. Now, can I use this to get the Lookup ID, rather than value? Yes. There is an attribute on the FieldRef node that defines this – LookupId . I set this to ‘True’:

I then re-escaped all the HTML to get back to the awful looking string, and pasted it back into my DataSource. I saved the page and tried it – and it worked!

Now I just have to figure out how to make this easily deployable.

Modify ListItem Display to show referencing items…

Leave a Reply

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

You are commenting using your 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