Master/Detail Pages in SharePoint 2007 (Idea 2)

I want to show you one of the ways how to quickly establish parent – child relationship in SharePoint. By using this way you will be able to add child items on the parent item view page as shown in the image below:

The idea how to add new child item form is borrowed from OOTB SharePoint Blog application template. By investigating how comments are implemented on Post.aspx page I was able to reuse OOTB SharePoint:SubmitCommentButton control which is used by BlogCommentsForm SharePoint:RenderingTemplate. BlogCommentsForm rendering template is defined in Program FilesCommon FilesMicrosoft Sharedweb server extensions12TEMPLATECONTROLTEMPLATESDefaultTemplates.ascx file. So here are quick steps how to achieve this:

  1. First you need a parent and child lists. In my example I have Orders and Oder details lists. In child list you need to create a lookup column to parent list named PostTitle (you must use this name because this is the name of column which is used by OOTB SubmitCommentButton functionality). It is important to choose ID column in the “In this column” combo box. You can hide PostTitle lookup column if you want.
  2. Now using SharePoint Designer 2007 open your site and navigate to the parent list folder. Copy DispForm.aspx and rename the copy CustomDispForm.aspx (you can choose whatever name you want).
  3. In the CustomDispForm.aspx replace ListFormWebPart with DataFormWebPart.
  4. Add new ListFormWebPart for the new child list item form. Choose New item form in List or Document Form dialog.
  5. Add child list Web Part for displaying all child list items.
  6. Set CustomDispForm.aspx to be the parent list default display form.
  7. In the DefaultTemplates.ascx find SharePoint:RenderingTemplate with ID=”BlogCommentsForm”. Select and copy all SharePoint:RenderingTemplate tag.
  8. Create new file SubmitNewProduct.ascx and paste the code you copied in step 7 (you can choose another file name).
  9. Find SharePoint:SubmitCommentButton tag and modify Text attribute to whatever you want (in my example I will use “Add Product”). Save the file in the same directory as DefaultTemplates.ascx.
  10. Using SharePoint Designer 2007 open CustomDispForm.aspx created in step 2. Find ListFormWebPart added in step 4. Change TemplateName tag to a name you named the file in step 8.
  11. Now when you open Order (parent list item) you already can add new child items. But last web part on page still displaying not filtered child items list. All you need to do is Edit the page and modify last web part by setting the following filter: PostTitle is equal to [ID].

In the next post I show how to implement a child item selection from another list. If you noticed in the image above Order details item have a lookup column name Product. By selecting Product automatically are filled child item fields. In others solutions it may be enough to have just a lookup column, but in my case I need to fix product details (name, price and etc.) at the time of Order or Invoice creation because later on product price may change.