Phase 5 / The Validation User Interface

The DES Validation Framework provides the underlying tools for the validation user interface. There are many aspects to communicating validation errors.

Validation from inside a Field Template

Each Field Template that supports editing contains a BLDDataFieldValidators control. This control creates the actual Validator web controls based on the business rules.

<%@ Control Language="C#" AutoEventWireup="true"
  Inherits="PeterBlum.DES.BLD.DateEditFieldTemplate" %>
 <script runat="server">

   protected void Page_Init(object sender, EventArgs e)
   {
      SetUpEditableDataControl(DateTextBox1);
      SetUpBLDDataFieldValidators(BLDDataFieldValidators1);
   }
</script>

<des:DateTextBox ID="DateTextBox1" runat="server" ></des:DateTextBox>
<des:BLDDataFieldValidators ID="BLDDataFieldValidators1" runat="server" >
</des:BLDDataFieldValidators>

The errors are shown at the location of this control. If there are multiple errors to show, it knows how to format them either as a list or a paragraph style using its ErrorMessagesFormat property.

The BLDDataFieldValidator has several other formatting properties, including NoErrorFormatter which displays an image when an error is corrected.

Because the BLDDataFieldValidator is inside of the Field Template, if you want to change these formatting properties, add the BLDCustomizer control. It has several properties which are used as defaults for the BLDDataFieldValidator's own properties.

<des:BLDCustomizer ID="BLDCustomizer1" runat="server" 
  BLDDataFieldValidators_ShowRequiredFieldMarker="True" 
  BLDDataFieldValidators_ErrorMessagesFormat="Paragraph" FocusOnSubmit="True" 
  BLDDataFieldValidators_NoErrorFormatterMode="Corrected" />

Relocating where Validation Error Messages appear

Sometimes you want errors to show in a different location than side-by-side with the data entry control. In this case, add a BLDDataFieldValidators control into your Web Form's markup where you want it to appear. Then point the BLDDataField control to it through its BLDDataFieldValidatorsControlID property and set its BLDDataFieldValidatorsMode to OutsideFieldTemplate. Now the BLDDataFieldValidator inside of the Field Template uses the other one to output its errors.

<des:BLDDataField id="BLDDataField1" runat="server" DataField="Price" 
  BLDDataFieldValidatorsControlID="BLDDataFieldValidators1" 
  BLDDataFieldValidatorsMode="OutsideFieldTemplate" /> 
some HTML here
<des:BLDDataFieldValidators id="BLDDataFieldValidators1" runat="server"  
  ErrorFormatterSkinID="{DEFAULT}" ShowRequiredFieldMarker="true"  
  NoErrorFormatter-Mode="Always" />

Changing the error messages themselves

Your Business Logic Layer defines the validation rules and supplies them with default error messages. Often the messages need to be changed to better fit the situation.

When using a BLDDataField control, add a companion BLDDataFieldValidators and use its ErrorMessages property to define a list of validators and their error messages.

<des:BLDDataField id="BLDDataField1" runat="server" DataField="Price"
  BLDDataFieldValidatorsControlID="BLDDataFieldValidators1"/>
<des:BLDDataFieldValidators id="BLDDataFieldValidators1" runat="server">
  <ErrorMessages>
    <desda:ErrorMessages NameOfValidationAttributeType="RequiredAttribute"
      ErrorMessage="Requires an entry"
      SummaryErrorMessage="{LABEL} requires an entry." />
  </ErrorMessages>
</des:BLDDataFieldValidators>

When using a DataFieldInPattern object, use its ErrorMessages property to define a list of validators and their error messages.

Drawing the user's attention to the errors

DES Validation Framework has numerous ways to make validators attract the user’s attention. They include:

• ErrorFormatters – Classes that control the appearance of the error message at the location of the Validator control.
  
  Details and demo
  You can set the ErrorFormatter on the BLDDataFieldValidators control or at the page level using the PageManager's DefaultErrorFormatterSkinID property.
• Displaying an alert box. Details
• Setting focus to fields with the error. Details
• Changing the style of the control with the error. Details
• Changing the style of controls near the error, such as the label. Details
• Blink the error message. Details
• Displaying a confirmation box when there are warning messages (from ValidationAttributes whose ValidationScope property is Warning.)

All of these can be setup by adding DES’s PageManager control to the page. It hosts their properties.

<des:PageManager id="PageManager1" runat="server" 
  DefaultErrorFormatterSkinID="PopupView {Display='Dynamic'}" 
  ChangeStyleOnControlsWithError="True" FocusOnSubmit="True" 
  HiliteFieldsNearbyError="True" />

The ValidationSummary control

The ValidationSummmary control should be added to any page where errors are possible. It shows all errors reported in a single area. Often you hide the error messages in the location of the BLDDataFieldValidators control and just show them in the ValidationSummary.

There are times the business logic will introduce errors that are not covered by BLDDataFieldValidators. For example, prior to saving, it may check a field to ensure the value is unique, and report an error if not. The ValidationSummary is the only place where these errors are shown.

The DES Validation Framework provides the ValidationSummary control used by BLD. Its feature set is far richer than the native ValidationSummary control of ASP.NET.

In the next topic, you will use the BLD Database Explorer with changes applied based on the topics of Phase 5.