How to: Customize ASP.NET Dynamic Data Default Field Templates

You can customize how the default field templates display, edit, and insert data by modifying their properties.

For more information about default field templates, see ASP.NET Dynamic Data Scaffolding.

Note

Changes that are made to a default field template will apply to all pages and controls where the template is used throughout the Web application.

The following procedure shows how to add a background color to Text_Edit.ascx, one of the field templates provided in a Dynamic Data project by default.

To customize a default field template

1. In Visual Studio 2010 or Visual Web Developer 2010 Express (or a later version of these products), open the ASP.NET Dynamic Data Web site.

2. In the DynamicData/FieldTemplate folder, open the default field template you want to modifyand switch to Source view.

3. Modify the code to customize the field template

   For example, you can add the following code snippet to modify the Text_Edit.ascx field template

   <asp:TextBox ID="TextBox1" runat="server" BackColor="Yellow"  
     Text='<%# FieldValueEditString %>'>
   </asp:TextBox>
   

   This code snippet adds a background color property to the markup and sets it to yellow. The modified Text_Edit.ascx code will be similar to the following code example.

   Note

   You can use a .css file to set the BackColor.

Example

The following code example shows the modified Text_Edit.ascx field template. This modified field template changes the background color of the text box that displays String, Decimal, Double, and Int32 data types to yellow when a table is in edit mode. This modification affects any row on the website that is in edit mode:

See a video that shows this feature: Watch.

<%@ Control Language="VB" Inherits="System.Web.DynamicData.FieldTemplateUserControl" %>

<asp:TextBox ID="TextBox1" runat="server" BackColor="Yellow" Text='<%# FieldValueEditString %>'></asp:TextBox>
<asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />
<asp:RegularExpressionValidator runat="server" ID="RegularExpressionValidator1" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />
<asp:DynamicValidator runat="server" ID="DynamicValidator1" ControlToValidate="TextBox1" Display="Dynamic" />

<%@ Control Language="C#" Inherits="System.Web.DynamicData.FieldTemplateUserControl"%>

<asp:TextBox ID="TextBox1" runat="server" BackColor="Yellow" Text='<%# FieldValueEditString %>'></asp:TextBox>
<asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />
<asp:RegularExpressionValidator runat="server" ID="RegularExpressionValidator1" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />
<asp:DynamicValidator runat="server" ID="DynamicValidator1" ControlToValidate="TextBox1" Display="Dynamic" />

Compiling the Code

• Visual Studio 2010 or Visual Web Developer 2010 Express.

• A Dynamic Data Web site. For more information, see Walkthrough: Creating a New Dynamic Data Web Site Using Scaffolding.

See Also

Tasks

How to: Customize Data Field Display in the Data Model