How to add a linked List to your DispForm.aspx

Today I was modifying the DispForm.aspx (view page) to one of my Lists to link a second list below the first. This is so easy to do, and I do it allot just for convenience, but I don’t think I have ever taken the time to document it, so here it is.

If you have two lists that are linked by a common field using a Data Lookup field, then adding the second list to the first’s view and edit pages is something you may want to do.

        My disclaimer: The way I am showing this will customize or un-ghost the DispForm.aspx page.

My first List is called Inventory and all the fields are static fields, meaning they are not really expected to change their values, thus just one unique record for each item in inventory is expected.

My second List is called Inventory Updates and consists of all of the fields that are dynamic or that are expected to change periodically. This List will have multiple entries that link to one item in the Inventory List. The Inventory Updates List has a Data Lookup field that points to the Inventory ID built in field.

First I edited the default page (AllItems.aspx) to my Inventory List and added the Inventory Updates List Web Part on bottom and the Form Web Part on top. Then I made a Connection on the Form Web Part to Provide Values to the Inventory Updates web part. This is not required for the editing of the DispForm.aspx page we are about to do, but I do it just for consistency so both Lists are always linked in all views.

Moving on…now I open SharePoint Designer and open the individual site.

1. Navigate to the LISTS container and expand my Inventory List and double click on the DispForm.aspx.
2. Click on the Inventory Main area so the WebPartPages:ListFormWebPart is highlighted.
3. Then click the Right Arrow just once. This will move your cursor to the open space underneath the web part.
4. Now from the menu select INSERT – SHAREPOINT CONTROLS – DATA VIEW.
5. It will insert the area for the Data View, now click on the hyperlink to add new Data Source Library in the box.
6. On the right under Data Source Library click on the second List, for us it is Inventory Updates.
7. From the item drop down select SHOW DATA.
8. Then press Ctrl Click on the fields you want to display.
9. Then click the button above the fields called INSERT SELECTED FIELDS AS…MULTIPLE ITEM VIEW.
10. Click on the new WebPartPages:DataFormWebPart and you will see a right arrow appear, click on that to see your Common Data View Task options.
11. Click on Filter:
12. In the Filter Criteria box select the Data Lookup Field, mine is Field Name = InventoryID, Comparison = Equals.
13. On the Value field arrow to the bottom and select CREATE A NEW PARAMETER.
14. Click NEW PARAMETER button, in the NAME field enter the name of this parameter, mine is InventoryID.
15. In the PARAMETER SOURCE select Query String.
16. In the Query String Variable field enter ID .
17. In the Default Value field enter 1 .
18. Then select OK.
19. Now your VALUE field back in the Filter Criteria box should show your new parameter name, mine is [InventoryID].
20. Now just select OK to complete the filter.
21. You can then go through the other formatting tasks such as Sorting, etc. as you wish, but the actions above are all that are needed to link the two lists on this one page.
22. Then select to SAVE this PAGE.

Now you can go to your Inventory List DispForm.aspx page and see that when you select an item from the first list, all linked records from the second list will appear underneath.

Technorati Tags: SharePoint Linked List,DispForm.aspx,SharePoint Designer