Adding Comments to a List Part 2

So here is what we have done so far from Part 1   

  • Create a custom list to hold our comments
  • Link the list with an Annoucements list using lookup columns
  • Create a page to display a single annoucement and the realted comments from our comments list.

This is what it looks like:   

What we have so far.


 All we need to do now is setup a form on the page to allow users to create new comments on the item they are viewing.   


Adding the New Comment Form

 Open the page in SharePoint Designer and add a Custom List form to the page below the comments list.   

Insert a custom list form


Choose the comments list and select the new item form option


 Your page should look something like this:   

So now we have a form that we can use to add comments to our comments list but the problem is we need to make sure each comment is associated with the right Annoucement.   

Associating the Comment

To associate the comment with the right Annoucement we need to set the value of the post field to corespond with the annoucement we are viewing. To do this we will use a parameter.   

  • In the Common Data View Tasks pane click on Parameters
  • Create a new parameter (the name does not really matter).  Set the parameter to get its value from the query string variable item.

So now we have the ID of the Annoucement and we just need to use that value to populate the Post column. To do this we will edit the comment form.   

Click on the small arrow beside the Post field on the comments form and choose Format Item As > Text Box   


Now we need to set the value of the text box to our variable.    

  • In code view do a search for asp:TextBox
  • The code will look something like this

<asp:TextBox runat=”server” text=”{@post}” __designer:bind=”{ddwrt:DataBind(‘i’,concat(‘ff2′,$Pos),’Text’,’TextChanged’,’ID’,ddwrt:EscapeDelims(string(@ID)),’@post’)}” />   

  • Change the text attribute from {@post} to {$you-param-name}
  • Save the page and test it.  When you load the page the text box should populate with the ID of the Annoucment that is being displayed (the same value as in the qurey string variable).  Update the value of the query string variable just to make sure it is changing the text box value.
  • Once you have verified that the parameter is working properly you can hide the text box by adding the class ms-hidden to the <td> holding it and the <td> holding the label.
  • Test the form and verify it is working.


When you tested the form you probably noticed that instead of bringing you back the the annoucements page you were taken to the AllItems view of the comments list. This is normal but not what we want. To fix this we will have to make a few more small edits to the comments form.   

  • In SharePoint Designer delete the OK and Cancel buttons on the comments form (dont worry we will replace them)
  • In code view paste this code where you want the save button to be.
    <input type="button" value="Submit" class="submitComment" name="btnSave" onclick="javascript: {ddwrt:GenFireServerEvent('__commit;__redirect={}')}" />
  • Set the redirect parameter to the url of whatever page you want to send people to.
  • Test the form and make sure everything works


Using this method you can add the ability to post comments to lists that are not blogs.  Once you have everything setup and working its pretty simple to make the form and the comments look better using CSS. If you have questions feel free to post a comment.  

As a result of some acusations of plagarism I am adding links to some other resources somewhat related to this topic. The point of this blog is not to duplicate or take credit for the effort of others. 

6 Responses

Add a Comment

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