How to: Create ASP.NET Web Server Control Templates 

Controls such as the DataList, GridView, FormView, and Repeater Web server controls allow you to specify templates, which are HTML elements that define the layout for a particular portion of the control. For example, in the GridView control, you can define templates for items, selected items, alternating items, and so on, so that each of these elements can have a custom look.

To create a Web server control template

  1. In the .aspx file, insert an element inside the control to identify what template you are creating, as in the following example:

    <asp:DataList id="DataList1" runat="server">
      <ItemTemplate>
    
      </ItemTemplate>
    </asp:DataList>
    
    <asp:DataList id="DataList1" runat="server">
      <ItemTemplate>
    
      </ItemTemplate>
    </asp:DataList>
    
  2. Inside the template element, add HTML text and other controls as the template's content. Include property and data-binding values for the embedded controls using normal syntax, as in the following example:

    <asp:DataList id="DataList3" runat="server">
       <ItemTemplate>
        Name: <asp:Label ID="Label2" runat="server" 
        Text='<%# DataBinder.Eval(Container, "DataItem.EmployeeName")%>'/>
       </ItemTemplate>
    </asp:DataList>
    
    <asp:DataList id="DataList3" runat="server">
       <ItemTemplate>
        Name: <asp:Label ID="Label2" runat="server" 
        Text='<%# DataBinder.Eval(Container, "DataItem.EmployeeName")%>'/>
       </ItemTemplate>
    </asp:DataList>
    
  3. Repeat Steps 1 and 2 for each template you want to create.

The following example shows a complete declaration for a DataList Web server control with simple templates declared for the HeaderTemplate, ItemTemplate, and SeparatorTemplate templates:

<asp:datalist id="DataList2" runat="server" >
   <HeaderTemplate>
   Items matching your query: 
   </HeaderTemplate>
   <ItemTemplate>
   Name: <asp:Label id="Label1" runat="server" 
     Text='<%# DataBinder.Eval(Container, "DataItem.EmployeeName")%>'></asp:Label>
   </ItemTemplate>
   <SeparatorTemplate>
     <br><hr>
   </SeparatorTemplate>
</asp:datalist>
<asp:datalist id="DataList2" runat="server" >
   <HeaderTemplate>
   Items matching your query: 
   </HeaderTemplate>
   <ItemTemplate>
   Name: <asp:Label id="Label1" runat="server" 
     Text='<%# DataBinder.Eval(Container, "DataItem.EmployeeName")%>'></asp:Label>
   </ItemTemplate>
   <SeparatorTemplate>
     <br><hr>
   </SeparatorTemplate>
</asp:datalist>

See Also

Concepts

ASP.NET Web Server Controls Templates