Creating Custom Form Templates

Applies to: SharePoint Foundation 2010

The Microsoft ASP.NET control templates that are defined in the DefaultTemplates.ascx file at %ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\CONTROLTEMPLATES\ determine the layout of Microsoft SharePoint Foundation 2010 list item forms. These templates can nest controls that in turn use more control templates for form layout definition. The controls can contain HTML markup and Web controls, but not data-bound statements involving <%#...%> syntax. To override a default control template globally on a front-end Web server, you can add a custom .ascx file to the \CONTROLTEMPLATES directory with a control template identifier (ID) that matches the ID of the existing one in the DefaultTemplates.ascx file. For information about how to create a user control in Microsoft Visual Studio, see How to: Create a User Control for a SharePoint Application Page or Web Part.

Creating Custom Templates

In addition to overriding default templates, you can create your own custom form templates and refer to them by either list type or content type. To register a custom form template by list type, specify the name of the form template through the Template attribute on a <Form> tag in the Schema.xml file of the list definition, as in the following example.

<Forms>
  <Form Type="DisplayForm" Url="DispForm.aspx" SetupPath="pages\form.aspx" WebPartZoneID="Main" /> 
  <Form Type="EditForm" Url="EditForm.aspx" SetupPath="pages\form.aspx" Template="MyCustomForm" WebPartZoneID="Main" /> 
  <Form Type="NewForm" Url="NewForm.aspx" SetupPath="pages\form.aspx" Template="MyCustomForm" WebPartZoneID="Main" /> 
</Forms>

The following example defines two additional custom forms.

<Forms>
  <Form 
    Type="DisplayForm" 
    Url="DispForm.aspx" 
    SetupPath="pages\form.aspx" 
    WebPartZoneID="Main" Default="FALSE"/>
  <Form 
    Type="DisplayForm" 
    Url="MyDispForm.aspx" 
    SetupPath="pages\form.aspx" 
    WebPartZoneID="Main" 
    UseDefaultListFormWebPart="False" 
    Default="TRUE">
    <WebParts>
      <AllUsersWebPart WebPartZoneID="Main" WebPartOrder="3"><![CDATA[
        <WebPart xmlns="https://schemas.microsoft.com/WebPart/v2">
          <Assembly>Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c</Assembly
          <TypeName>Microsoft.SharePoint.WebPartPages.ListFormWebPart</TypeName>
          <PageType>PAGE_DISPLAYFORM</PageType>
        </WebPart>]]>
      </AllUsersWebPart>
      <AllUsersWebPart WebPartZoneID="Main" WebPartOrder="1"><![CDATA[
        <WebPart xmlns="https://schemas.microsoft.com/WebPart/v2">
          <Assembly>Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c</Assembly>
          <TypeName>Microsoft.SharePoint.WebPartPages.ListViewWebPart</TypeName>
          <PageType>PAGE_VIEW</PageType>
          <ViewFlags>Hidden ReadOnly Html</ViewFlags>
        </WebPart>]]>
      </AllUsersWebPart>
    </WebParts>
  </Form>
  <Form 
    Type="EditForm" 
    Url="EditForm.aspx" 
    SetupPath="pages\form.aspx" 
    WebPartZoneID="Main" />
  <Form
    Type="EditForm"
    Url="MyEditForm.aspx"
    SetupPath="pages\form.aspx"
    WebPartZoneID="Main"
    Default="TRUE"
    UseDefaultListFormWebPart="False"
    WebPartOrder="1">
    <WebParts>
      <AllUsersWebPart WebPartZoneID="Main" WebPartOrder="1"><![CDATA[
         <WebPart xmlns="https://schemas.microsoft.com/WebPart/v2">
           <Assembly>Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c</Assembly>                         
           <TypeName>Microsoft.SharePoint.WebPartPages.ListViewWebPart</TypeName>
           <PageType>PAGE_VIEW</PageType>
           <ViewFlags>Hidden ReadOnly Html</ViewFlags>
         </WebPart>]]>
       </AllUsersWebPart>
       <AllUsersWebPart WebPartZoneID="Main" WebPartOrder="2"><![CDATA[
         <WebPart xmlns="https://schemas.microsoft.com/WebPart/v2" xmlns:iwp="https://schemas.microsoft.com/WebPart/v2/Image">
           <Assembly>Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c</Assembly>
           <TypeName>Microsoft.SharePoint.WebPartPages.ImageWebPart</TypeName>
           <FrameType>None</FrameType>
           <Title>Site Image</Title>
           <iwp:ImageLink>/_layouts/images/homepage.gif</iwp:ImageLink>
           <iwp:AlternativeText>Logo</iwp:AlternativeText>
         </WebPart>]]>
       </AllUsersWebPart>
       <AllUsersWebPart WebPartZoneID="Main" WebPartOrder="3"><![CDATA[
         <WebPart xmlns="https://schemas.microsoft.com/WebPart/v2">
           <Assembly>Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c</Assembly>            
           <TypeName>Microsoft.SharePoint.WebPartPages.ListFormWebPart</TypeName>
           <PageType>PAGE_EDITFORM</PageType>
         </WebPart>]]>
       </AllUsersWebPart>
       <View BaseViewID="1" WebPartZoneID="Main" WebPartOrder="4" />
     </WebParts>
   </Form>
   <Form 
     Type="NewForm" 
     Url="NewForm.aspx" 
     SetupPath="pages\form.aspx" 
     WebPartZoneID="Main" />
</Forms>

To register a custom form template by content type, add a definition such as the following as a child of the <ContentType> tag in your Elements.xml file for the Feature.

<XmlDocuments>
  <XmlDocument NamespaceURI="https://schemas.microsoft.com/sharepoint/v3/contenttype/forms">
    <FormTemplates  xmlns="https://schemas.microsoft.com/sharepoint/v3/contenttype/forms">
      <Display>MyCustomForm</Display>
      <Edit>MyCustomForm</Edit>
      <New>MyCustomForm</New>
    </FormTemplates>
  </XmlDocument>
</XmlDocuments>

In the previous examples, "MyCustomForm" is the ID of a custom control template that you are adding to the \CONTROLTEMPLATES directory.

Template Structure

ASCX-based control templates bring together multiple controls into a nested structure, where the controls themselves consist of templates and can be used to richly extend list item forms.

The document library form template that is defined in %ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\CONTROLTEMPLATES provides a good example of a control template structure. The following example shows the default control template that is defined for the document library form.

<SharePoint:RenderingTemplate ID="DocumentLibraryForm" runat="server">
  <Template>
    <SharePoint:InformationBar runat="server"/>
      <wssuc:ToolBar CssClass="ms-formtoolbar" id="toolBarTbltop" RightButtonSeparator="&nbsp;" runat="server">
        <Template_RightButtons>
          <SharePoint:SaveButton runat="server"/>
          <SharePoint:GoBackButton runat="server"/>
        </Template_RightButtons>
      </wssuc:ToolBar>
    <SharePoint:FormToolBar runat="server"/>
    <SharePoint:FormComponent TemplateName="DocumentLibraryFormCore" runat="server"/>
  </Template>
</SharePoint:RenderingTemplate>

In this example, the document library form template draws together several components to lay out the complete form template. Many of these components derive from the Microsoft.SharePoint.WebControls.FormComponent base class, which itself derives from Microsoft.SharePoint.WebControls.TemplateBasedControl and means that the components can themselves be made into templates.

However, most of the form is actually rendered through a separate template that is defined in the DefaultTemplates.ascx file whose ID is DocumentLibraryFormCore. This template is further composed of various components, including some table-based HTML structure to help organize the page layout, as shown in this example.

<SharePoint:RenderingTemplate ID="DocumentLibraryFormCore" runat="server">
  <Template>
    <TABLE class="ms-formtable" style="margin-top: 8px;" border=0 cellpadding=0 id="formTbl" cellspacing=0 width=100%>
      <SharePoint:ChangeContentType runat="server"/>
      <SharePoint:DocumentLibraryFields runat="server"/>
      <SharePoint:ApprovalStatus runat="server"/>
    </TABLE>

    <SharePoint:WebPartPageMaintenanceMessage runat="server"/>
    <SharePoint:DocumentTransformersInfo runat="server"/>
    <table cellpadding=0 cellspacing=0 width=100%><tr><td class="ms-formline"><IMG SRC="/_layouts/images/blank.gif" width=1 height=1 alt=""></td></tr></table>
    <TABLE cellpadding=0 cellspacing=0 width=100% style="padding-top: 7px"><tr><td width=100%>
      <SharePoint:ItemHiddenVersion runat="server"/>
      <SharePoint:InitContentType runat="server"/>
      <wssuc:ToolBar CssClass="ms-formtoolbar" id="toolBarTbl" RightButtonSeparator="&nbsp;" runat="server">
        <Template_Buttons>
          <SharePoint:CreatedModifiedInfo runat="server"/>
        </Template_Buttons>
        <Template_RightButtons>
          <SharePoint:SaveButton runat="server"/>
          <SharePoint:GoBackButton runat="server"/>
        </Template_RightButtons>
      </wssuc:ToolBar>
    </td></tr></TABLE>
  </Template>
</SharePoint:RenderingTemplate>

A key component in the DocumentLibraryFormCore template of this example is the DocumentLibraryFields component, which refers to the Microsoft.SharePoint.WebControls.DocumentLibraryFields control that derives from the Microsoft.SharePoint.WebControls.ListFieldIterator class. The list field iterator contains the logic for laying out fields in a columnar order. However, the ListFieldIterator class only renders controls if they have not been overridden in the templates. Therefore, if you add a field control for a specific field (for example, a control that puts the Title field control in the upper right and the Author field control under it), the iterator does not lay out that control. You can also instead choose to specify your own list field iterator, which derives from the ListFieldIterator class, and provide custom logic to do field iteration.

You can override the DocumentLibraryForm template and specify a different DocumentLibraryFormCore template. You can then further customize the form template from there, specifying existing controls, or adding references to other custom controls that are defined in an assembly or .ascx file.