The Calendar control is one of the controls that cannot be validated in its original state. In many cases, however, you must be able to validate the user selection in the Calendar control. There are two solutions to this problem:
- Write a custom validator control.
- Extend the Calendar control so that you can use it with the built-in validation controls.
NOTE: This article demonstrates how to extend the Calendar control for server-side validation only. For client-side validation to occur, the validation controls hook up to the corresponding HTML control's Value property. Because many HTML controls are used to build the Calendar control, no single HTML control contains the selected value for the Calendar control. Thus, client-side validation is not appropriate for the Calendar control.
Extend the Calendar Control
To extend the Calendar control, you can create a class that inherits from the existing Calendar control. To allow the control to interact with the validation controls, you add the ValidationProperty attribute and a property that returns the selected date in a format that is suitable for the validation controls.To allow the control to be used with the RequiredFieldValidator control, you return an empty string if the SelectedDate property of the Calendar control is set to "01-Jan-0001" because "01-Jan-0001" is the date that is returned if no date is selected. In all other cases, you return a string that contains the date in the yyyy/MM/dd format that the RangeValidator control can use.
- Open Microsoft Visual Studio .NET or Microsoft Visual Studio 2005, and then create a new Visual Basic ASP.NET Web Application project.
- From the Project menu, add a new class to your application as follows: NOTE: In the date format above, "MM" must be uppercase to return the month because the lowercase "mm" returns minutes. If you return the date in this format, you can use string comparison to check range.
<ValidationProperty("Text")> Public Class VCalendar Inherits System.Web.UI.WebControls.Calendar Public ReadOnly Property Text() Get Dim DateString As String = Me.SelectedDate.ToString("yyyy/MM/dd") If DateString = "0001/01/01" Then Return "" Else Return DateString End If End Get End Property End Class
- Save the file, and click Build on the Build menu to build the application.
Add the Control to a Web Form
To add a custom control to a Web Form, you must add a reference to the top of the Web page. This defines the namespace and tag that you use in the HTML.- Add an .aspx page to the project.
- At the top of the page, use the <%@ register %> directive to register the control as follows: NOTE: You must change "Namespace" to match the namespace that is used in the class file and "Assembly" to match the project name of your application.
<%@ Register TagPrefix="Custom" Namespace="ExtendCalendar" Assembly="csExtendCalendar" %>
- Add a VCalendar control inside the <FORM runat="server"></FORM> tag
as follows:
<CUSTOM:VCALENDAR id="MyCalendar" runat="server"></CUSTOM:VCALENDAR>
- Switch to Design view. The Calendar control should appear on the Web Form. If the Calendar control does not appear, verify that the "Namespace" and "Assembly" settings are correct.
Link to Validator Controls
The sample code in this section demonstrates how to add a RangeValidator and RequiredFieldValidator control to the Web Form and how to link them to the VCalendar control.- Add a RangeValidator and RequiredFieldValidator control to the Web Form, and set the properties of these controls
as follows to link these controls to the Calendar control:
RangeValidator:ControlToValidate: MyCalendarRequiredFieldValidator:
ErrorMessage: Date must be between 10/1/2001 and 10/31/2001
MinimumValue: 2001/10/01
MaximumValue: 2001/10/31
EnableClientScript: FalseControlToValidate: MyCalendar
ErrorMessage: Please enter a date!
EnableClientScript: False - Add a Web Form Button control to the page.
Test the Web Page
- Click Build on the Build menu to build the application.
- In Solution Explorer, right-click the Web Form, and then click View in Browser.
- You should see a page that contains a Calendar control and a button. Click the button. You should receive the RequiredFieldValidator error message.
- Select a date outside the range of 01-Oct-2001 to 31-Oct-2001, and then click the button. The RequiredFieldValidator error message should disappear, and you should receive the RangeValidator error message.
- Select a date in the range of 01-Oct-2001 to 31-Oct-2001, and then click the button. Neither validator message should appear.