A few hints and tips about the validation controls. There are several
things we often need to do that aren't immediately obvious.
(There's a simple video showing how to add the validation controls at
Validation on a drop down list
At first glance it looks as though there is no way of adding the normal
validation to a drop down list to indicate that a values needs to be selected.
In fact it's very simple.
Add a list item 'Select', set it as 'selected' and put it's value = ""
Then add a RequiredFieldValidator to the drop list control. As no value is
given for the 'Select' option, the validator triggers and your error message is
A Simpler Validation Summary
The ValidationSummary control gives a list of all the fields that have failed
validation. Sometimes it's better just to have a simple indicator like
* Required Fields
This can be achieved by altering both the RequiredFieldValidators and the
The RequiredFieldValidator control has a 'Text' property as well as the
'ErrorMessage' property. If set, the Text property is used by the control in
place of the ErrorMessage, whilst the summary uses the ErrorMessage rather than
the text. The Summary also has a HeaderText property which we can use for a
So, we set them as follows:
runat="server" ErrorMessage="" Text="*" Font-Bold="True"
DisplayMode="SingleParagraph" HeaderText="* Required Fields" />
Note that the ValidationSummary has it's DisplayMode set to SingleParagraph
With validation controls ErrorMessage set to "" and the summary HeaderText
set to "* Required Fields" this is the summary message we get.
See an example
Giving focus to the form control that hasn't validated
It's normal to give focus to the first form item that has failed
validation. This is simple to do, but not obvious.
Having added your Validation controls and set them for the fields they
need to validate, select one of them and then look at the 'Behavior' group
in the 'Tag Properties' panel. Underneath the 'ControlToValidate' entry
you'll see a property "SetFoucusOnError', highlighted in yellow here.
Change this property from 'False' to 'True' and repeat this for every validation
Now, when the form is validated the first empty field will receive focus.
This is shown in the example used
At first glance there is no obvious way to validate dates that users
enter for the correct format. It's easy when you know how.
Add a CompareValidator alongside the form control you want to validate.
Use the tag properties to set the ControlToValidate to point at the
field you want validated. Then set 'Type' to 'Date', 'Operator' to 'DataTypeCheck'
and finally change the 'ErrorMessage' to something like 'Please enter a
Note that the date format expected is '28/06/2013', '28/06/13',
'2013/06/28', or '13/06/28 Anything else will trigger the