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