Field Template Basics
ASP.NET Dynamic Data provides field templates by employing customized user controls (.ascx files) located in the \DynamicData\FieldTemplates directory and they contain the UI definitions and basic validation for each data type in your model. The controls housed inside the field template control are matched against the data types from the data model, and at run time the field template is rendered inside a grid/view control. The field template’s mode is based on the URL routing defined in the global.asax file, so particular pages map to particular modes (e.g., list.aspx for read only, edit.aspx for editing). The dynamic fields are rendered based on the data type + mode in as well. A few of the common field templates are shown in the table below and more can be found here http://msdn.microsoft.com/en-us/library/cc488508.aspx.
| Type | Field Template (Read Only) | Field Template (For Editing/Inserting) |
| Boolean | boolean.ascx | boolean_edit.ascx |
| DateTime | datetime.ascx | datetime_edit.ascx |
| Decimal | ---------------- | decimal_edit.ascx |
| Integer | ---------------- | integer_edit.ascx |
| Text | text.ascx | text_edit.ascx |
You’ll notice that the Decimal and Integer data types don’t have a read only template, and that’s because they use the template defined for text types. If a template isn’t defined for a given data type, Dynamic Data will try to fall back on a default type, usually text. For the purposes of only viewing the data, the text template will suffice for the numeric fields, although you can create your own if you want to format the number or have a different look.
A field template example
In this example I’ll use an AJAX slider control to control restrict access by the user to a range of integer values (18-58) for an Age field of a Person table. The slider would help corral the user into choosing a number within the proper range because they are limited in how far they can move the slider and always will stay within range. To setup your field template based on the slider control complete the following:
Create the Dynamic Data Field
Note that if you select “Dynamic Data Field” from the Add New Item dialog box and name your field “IntegerSlider” then both an IntegerSlider.ascx and IntegerSlider_Edit.ascx will be created for you. A Dynamic Data field control is a customized version of a standard user control with the key distinction being that Dynamic Data Fields inherit from the FieldTemplateUserControl class rather than just the UserControl class.
Since a slider control wouldn’t make sense when just viewing the field, you can delete the IntegerSlider.ascx if you’d like and Dynamic Data will fall back on a default template to display (text.ascx for read only mode).
The following code is needed to create a slider control in the Dynamic Data Field template:
<asp:TextBox ID="TextBox1" runat="server"
Text='<%# FieldValueEditString %>'
CssClass="droplist"></asp:TextBox>
<asp:Label ID="Label1" runat="server" />
<ajaxToolkit:SliderExtender ID="SliderExtender1"
runat="server"
TargetControlID="TextBox1"
Minimum="18"
Maximum="58"
BoundControlID="Label1" />
Annotate the metadata
In the metadata model, use the attributes below to decorate the property, in this case a field named Age that might belong to a class named Person. We’ll set the default value of the Age property to 20 even though the range is between 18 and 58.
[DefaultValue(20)]
And finally, we’ll attach the Age property to the IntegerSlider field template by adding a UIHint attribute to the Age property.
[UIHint("IntegerSlider")]
These attributes will be applied to properties in a metadata class. The metadata classes aren’t the entity classes in the data model but rather an extension to those classes that are usually implemented as a separate file with a two classes inside it: the entity class’s partial class extension and a metadata (or partner) class to the extension class. The extension class is decorated with the MetaDataClass attribute that designates the partner class, and this is the class that is annotated. If you’re wondering why you need the extra class, it is because of C# and VB.NET currently do not support partial properties, and we need to annotate the properties. Below is a completed code sample that uses the attributes, partial and partner classes as described above:
[MetadataType(typeof(Person_Meta))]
partial class Person
{
public class Person_Meta
{
[DefaultValue(20)]
[UIHint("IntegerSlider")]
public object Age { get; set; }
}
}
Summary
You’ve seen how to create an ASP.NET Dynamic Data field template by using a specialized web user control for the UI with ASP.NET AJAX components along with annotating the data model to specify which control to use. There are many other attributes available to annotate classes and fields with to customize your model and they are primarily found in the System.ComponentModel.DataAnnotations namespace.
