Creating Custom List Forms for Creating, Editing, or Displaying a List Item

You might have noticed that when you create a new list or library in SharePoint, a set of forms get automatically created for creating a new list item, editing a list item, or displaying that list item. When you add a new column to that list, the column automatically gets added to those forms. Where is this code generated? And how can you create your own Create, Edit, and Display forms?
 
If you look in the 12 hive, in the CONTROLTEMPLATES folder, you’ll see a file called DefaultTemplates.ascx. This file is rather huge, and if you open it up, you’ll see snippets of code that define the UI for everything from the label and textboxes you see on the automatically generated forms, to controls that render Blog posts and Calendar views. As we all know, though, it’s a no-no to edit core SharePoint files. (After all, what would happen when a service pack got released? Your changes would be overwritten.) SharePoint allows you to create your own control templates, and put them in a different file. As long as they reside in the CONTROLTEMPLATES directory, and use the SharePoint:RenderingTemplate server control, you can reference the template by the ID you assign it. (If you’re overriding an existing control, just give it the same ID as the control in the DefaultTemplates.ascx file, and SharePoint will automatically override the default template with your own.) (See How to: Override a Default Control Template for more details.)
 
OK, so how do we use this to our advantage? It’s possible to create your own ascx file with your own RenderingTemplate, and reference that template when displaying a form associated with a content type. For instance, when you create a new list item, perhaps you want the fields to show up in two columns of a table, rather than in one long vertical list. You can build an HTML table with two columns in your list, then use the SharePoint:FormField server controls for displaying the list columns that the user will enter their info into. Your code might look like this:
 
<SharePoint:RenderingTemplate ID=”CustomContentTypeCreateForm” runat=”server”>
<Template>
<table width=”100%” cellspacing=”0″ cellpadding=”10″ border=”0″>
<tr>
<td><SharePoint:FieldDescription runat=”server” ID=”TitleDescriptionField” ControlMode=”New” FieldName=”Title” /></td>
<td><SharePoint:FormField runat=”server” ID=”TitleField” ControlMode=”New” FieldName=”Title” /></td>
<td><SharePoint:FieldDescription runat=”server” ID=”FavoriteColorDescriptionField” ControlMode=”New” FieldName=”FavoriteColor” /></td>
<td><SharePoint:FormField runat=”server” ID=”FavoriteColorField” ControlMode=”New” FieldName=”FavoriteColor” /></td>
</tr>
</table>
</Template>
</SharePoint:RenderingTemplate>
(Make sure you have the right registrations at the top of your .ascx page, like the SharePoint assembly registration and the SharePoint control prefix.)

If you have controls in your template that need compiled code to run, such as showing or hiding fields in the template based on the field values, you can add references in the .ascx page to your own compiled web controls. You’ll just need to make sure you add a reference to your compiled web control at the top of the .ascx page, and deploy the dll with your SharePoint solution package.

The next step is to add a reference to your newly-created rendering template to your custom content type. If you take a look at the XML schema for defining a content type, you’ll see a node called XmlDocuments. Inside that, you’ll add an XmlDocument node, inside which you’ll add a FormTemplates node. In the FormTemplates node, you can add a New, Edit, and/or Display node, inside of which you’ll put the ID of the rendering template it should use. See FormTemplates Schema Overview for more information.

Based on the example rendering template described above, your XmlDocuments node might look like this:

<XmlDocuments>
  <XmlDocument NamespaceURI=”http://schemas.microsoft.com/sharepoint/v3/contenttype/forms“>
   <FormTemplates  xmlns=”http://schemas.microsoft.com/sharepoint/v3/contenttype/forms“>
     <New>CustomContentTypeCreateForm</New>
   </FormTemplates>
  </XmlDocument>
</XmlDocuments>

If you would like to associate this content type with a custom list definition, you can do it by adding the content type to the list’s schema.xml file. You would add the content type to the ContentTypes node. If you make this content type the default content type for the list (or the only content type for that matter), it will be the content type that’s automatically used when a user clicks the “New” button on a list’s toolbar. If you’ve created a custom “New” form for that content type, your custom rendering template will be used to render the “New” form the user sees.

Leave a Reply

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

WordPress.com Logo

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


%d bloggers like this: