Home     About PeterBlum.com     Policies     Download a Licensed Product     Newsletter
Peter's Business Logic Driven UI
Field Templates
Back to Product Overview  |  Next topic | Language preference:

The user interface is built upon Field Templates, user control files that ensure the user interface conforms to your business logic. Each Field Template handles a specific data type and there can be several setup for a single data type to handle the nuances of your application. These files are fully editable and you can add new ones, so you can customize the user interface as needed. They are shared by all web forms, providing a consistent user interface.

Here’s a look inside of Currency_Edit.ascx, the Field Template for editing Currency data types:

<%Control Language="C#" Inherits="PeterBlum.DES.BLD.CurrencyEditFieldTemplate" %>
<script runat="server">
protected void Page_Init(object sender, EventArgs e) { SetUpEditableDataControl(CurrencyTextBox1); SetUpBLDDataFieldValidators(BLDDataFieldValidators1); }
</script> <des:CurrencyTextBox id="CurrencyTextBox1" runat="server" /> <des:BLDDataFieldValidators id="BLDDataFieldValidators1" runat="server" />

It has two web controls. CurrencyTextBox comes with Peter’s Data Entry Suite to provide input for currency values. A Field Template can support any kind of input control, including those from a third party. In fact, BLD includes Field Templates for Telerik’s RadControls for ASP.NET AJAX and the AJAX Controls Toolkit. BLDDataFieldValidators installs the validator web controls based on the business logic, so you don’t have to worry about the UI matching the business requirements.

You use the BLDDataField control whereever you want a Field Template to be inserted into your Web Form. Specify the DataField in its DataField property. (Remember that a DataField is the property name in the Entity class.) It will choose a Field Template based on the DataTypeAttribute or field's actual type and from the data entry mode (readonly, edit, insert). You can override that by specifying the Field Template's name in the UIHint property (omitting the extension.)

<des:BLDDataField id="ProductName" runat="server" DataField="ProductName" />
<des:BLDDataField id="SupplierURL" runat="server" DataField="Supplier.HomePage" UIHint="Url" />

When you want to change how a Field Template works, it may seem obvious to just go an edit its file. Before you do that, evaluate the many ways Field Templates let the Web Form developer customize it.

  • Each Field Template User Control class defines public properties that can you can assign using the BLDDataField's TemplateProperties collection. More
  • The Named Styles lets you override default styles on controls inside of the Field Template and Pattern Templates. More
  • Error messages come from the business logic’s ValidatorAttributes. You can override them with the ErrorMessages property on various controls. There are also numerous settings to format validation error messages and draw the users attention to them. More
  • Field Template Behaviors can expand the features of some or all Field Templates without you modifying the Field Template’s code. BLD installs several Behaviors which you can modify to determine the ideal interface. More
  • Modify any aspect of the controls contained in the Field Template using several event handlers on the BLDPageManager control. More
  • Modify the business logic settings passed to your Field Template using the BLDPageManager.CustomizeDataField event handler.
<des:BLDDataField id="ProductName" runat="Server" DataField="ProductName">
   <NamedStyles>
     <des:NamedStyle Style="font-size:larger; font-weight:bold;"  />
   </NamedStyles>
</des:BLDDataField>
<des:BLDDataField id="SupplierHomePage" runat="server" DataField="Supplier.HomePage">
   <TemplateProperties>
     <des:UrlReadOnlyFieldTemplateProperties UrlText="{DATAFIELD:Supplier.CompanyName}" /> 
   </TemplateProperties>
   <Behaviors>
     <des:HintFieldTemplateBehavior Hint="Located in {DATAFIELD:CompanyLocation}"
       ApplyHintInReadOnlyMode="True" SharedHintFormatterName="AliceBlue-Small"
       ButtonLocation="AfterDataControl" UseOnlyButton="true"
       ButtonImageURL="~/Images/Info.gif" ButtonImageAlign="Bottom" />
   </Behaviors>
</des:BLDDataField>
Field Templates provided with BLD

BLD includes the following Field Templates, many of which utilize data entry controls from the Peter's TextBoxes and Peter's Date and Time modules of Peter's Data Entry suite.

Template name DataControl type DataTypes Notes
Anniversary.ascx Label DateTime  
Anniversary_Edit.ascx AnniversaryTextBox DateTime  
Boolean.ascx Image Boolean Displays different images 
BooleanLabel.ascx Label Boolean  
BooleanCheckBox.ascx Checkbox Boolean Checkbox is disabled 
Boolean_Edit.ascx Checkbox Boolean  
Calendar_Edit.ascx Calendar (DES) DateTime Use UIHint(“Calendar”) on DateTime 
Children.ascx Hyperlink   Goes to the related table
Currency.ascx Label Double, Decimal  
Currency_Edit.ascx CurrencyTextBox Double, Decimal  
Date.ascx Label DateTime  
Date_Edit.ascx DateTextBox DateTime  
DateTime.ascx Label DateTime  
DateTime_Edit.ascx DateTextBox and TimeOfDayTextBox DateTime  
DbImage.ascx Image Binary (image) Display an image
DbImage_Edit.ascx Image Binary (image) Display and upload an image
Decimal.ascx Label Double, Decimal  
Decimal_Edit.ascx DecimalTextBox Double, Decimal  
Duration.ascx Label DateTime, Double, Decimal, Integer  
Duration_Edit.ascx DurationTextBox DateTime, Double, Decimal, Integer  
EmailAddress.ascx Label or Hyperlink String  
EmailAddress_Edit.ascx FilteredTextBox String  
Enumerated.ascx Label Integer, String Optionally maps the raw value to different text.
Enumerated_Edit.ascx DropDownList Integer, String Optionally maps the raw value to different text.
ForeignKey.ascx HyperLink   Links to a PageTemplate showing the details of a record. 
ForeignKey_Edit.ascx DropDownList    
Integer.ascx Label Integer  
Integer_Edit.ascx IntegerTextBox Integer  
ManyToMany.ascx ListView of Hyperlinks Many to many  
ManyToMany_Edit.ascx CheckBoxList Many to many  
Measurement.ascx Label Integer, Double, Decimal Specialized number that includes a label
Measurement_Edit.ascx IntegerTextBox or DecimalTextBox Integer, Double, Decimal Specialized number that includes a label
MonthYear.ascx Label DateTime  
MonthYear_Edit.ascx MonthYearTextBox DateTime  
MultilineText_Edit.ascx TextBox (TextMode=Multiline) String Offers a TextCounter control.
Password.ascx Label String Shows “*****” instead of the password
Password_Edit.ascx FilteredTextBox (TextMode=Password) String  
Percent.ascx Label Double, Decimal  
Percent_Edit.ascx PercentTextBox Double, Decimal  
Text.ascx Label String Also used by multiline text in readonly mode.
Text_Edit.ascx FilteredTextBox String Supports characterset filtering
Time.ascx Label DateTime  
Time_Edit.ascx TimeOfDayTextBox DateTime  
Url.ascx Hyperlink String Provide a hyperlink for the URL
Url_Edit.ascx TextBox String  
UrlAsImage.ascx Image String Display an image associated with the URL
UrlAsImage_Edit.ascx Image and TextBox String  

If you use Telerik RadControls for ASP.NET AJAX, it also provides Field Templates that merge the RadControls data entry controls with the DES Validation Framework as shown here:

Template name DataControl type DataTypes Notes
Currency_Edit.ascx RadNumericTextBox Decimal, Double  
Date_Edit.ascx RadDatePicker DateTime  
DateTime_Edit.ascx RadDateTimePicker DateTime  
Decimal_Edit.ascx RadNumericTextBox Decimal, Double  
Enumerated_Edit.ascx RadCombobox Integer, String  
ForeignKey_Edit.ascx RadCombox    
Html_Edit.ascx RadEditor String Use DataTypeAttribute with DataType=Html.
Integer_Edit.ascx RadNumericTextBox Integer  
Measurement_Edit.ascx RadNumericTextBox Integer, Decimal, or Double  
MultilineText_Edit.ascx RadTextBox (TextMode=Multline) String  
Percent_Edit.ascx RadNumericTextBox Decimal or Double  
Text_Edit.ascx RadTextBox String  
Time_Edit.ascx RadTimePicker DateTime  

If you use Ajax Control Toolkit, it provides these Field Templates:

Template name DataControl type DataTypes
DateAjaxCalendar_Edit.ascx TextBox + CalendarExtender DateTime
Html_Edit.ascx AjaxControlToolkit's Editor String
IntegerSlider_Edit.ascx TextBox + SliderExtender Integer

Back to Product Overview  |  Next topic