Calendar Web Server Control Overview

Article
12/04/2014

The Calendar Web server control can be used to display selectable dates in a calendar and to display data associated with specific dates.

This topic contains:

Scenarios
Features
Background
Code Examples
Class Reference

Scenarios

You can use the Calendar Web server control to do the following:

Display and select dates The control displays a calendar through which users can move to any day in any year. Setting the SelectedDate property causes a specific date to be highlighted in the control. Optionally, users can move to arbitrary dates by clicking a day or moving from month to month. The calendar can be configured to enable users to select multiple dates, either a whole week or a whole month.

A representation of the Calendar control displaying the month of October
Display appointments or other information in a calendar grid The Calendar control can display specific details for individual days, such as a to-do list, a schedule of events, or similar information. This feature enables you to display day information from a database.

Features

You can use the Calendar control to do the following:

Capture user interaction such as when a user selects a date or a range of dates.
Customize the calendar's appearance.
Display information from a database in the calendar.

Background

The Calendar control displays the dates for one month at a time, with a total of six weeks appearing at the same time. The control supports several types of dates, which are described in the following table.

Type of date	Description
TodaysDate	By default, this is set to match the current date on the server. However, you can adjust it so that the date appears correctly for a different locale.
VisibleDate	This date determines which month appears in the calendar. The user can move from month to month on the calendar, which changes the visible date without affecting today's date. You can navigate between months by setting the visible date programmatically.
SelectedDate, SelectedDates	This is the date or date range that the user chooses. In the control, the user can select a single day, week, or month, but can only select contiguous dates. You can also programmatically set the selected dates. In that case, you can set non-contiguous selected dates.

The Calendar control is based on the DateTime object, and therefore supports the full range of dates that is allowed by that object. Effectively, you can display any date between the years 0 and 9999 A.D.

On an ASP.NET page, the Calendar control is rendered as an HTML table. Therefore, some the control's properties pertain to various aspects of table formatting. A few of these properties are not fully supported in some older browsers. Therefore, not all the formatting features will be available in those browsers.

Enabling Date Selection

By default, the calendar enables users to click an individual date to select it. If you are using the control as a read-only calendar, you can disable the date-selection functionality.

If date selection is enabled, each day of the calendar contains a LinkButton control that raises an event when it is clicked. If you enable week or month selection, a column of links is added to the side of the calendar to enable the user to specify which week to select.

Customizing the Calendar's Appearance

You can set calendar properties to change the colors, size, text, and other visual features of the calendar. There are several ways to do this, as shown in the following table.

Customization method	Description
Setting properties	You can set properties to display gridlines, change which day is displayed as the first day of the week, and change the appearance of the month and day names.
Setting extended style properties	You can use properties derived from the Style object to set the appearance of particular elements in the calendar. This includes the current date or the title bar that contains the month and navigation links. These style properties are supported in browsers that can use cascading style sheets. A reduced set of appearance styles is supported for earlier browsers.
Customizing the rendering of individual days	As the control renders individual days, it raises an event that you can handle to modify the stream that is being rendered. This is useful not just for changing the appearance of days, but for including custom content on each day. For details, see How to: Customize Individual Days in a Calendar Web Server Control.

Capturing User Interaction with the Calendar Web Server Control

The Calendar control raises the SelectionChanged event when the user selects an individual date or range of dates. It raises the VisibleMonthChanged event when the user displays a new month. By creating methods for these events, you can determine what date or dates the user has selected and respond appropriately. One response might be to customize the display of that date.

Displaying Information from a Database in the Calendar Control

A common scenario is to display information from a database in the calendar. For example, an events calendar is often based on information that is stored in a database.

The Calendar control does not directly support data binding — that is, you do not bind the calendar as a whole to a data source. Instead, you create a method for the control's DayRender event, which is raised as each day in the current calendar month is being rendered. In the handler for this event, you can extract information from a data source and add it to the stream being rendered to the browser. For details, see How to: Display Selected Dates from a Database in the Calendar Control.

Accessibility

To make the Calendar control more accessible to users of assistive devices, the control supports a property named UseAccessibleHeader. When this property is set to true (which is the default setting), the column headings that contain the names of days are rendered using HTML th elements.

Code Examples

Class Reference

The following table lists the classes that relate to the Calendar control.

Member	Description
Calendar	The main class for the control.
CalendarDay	The class that represents a date in the Calendar control.
CalendarSelectionMode	An enumeration that represents the date selection modes available in the Calendar control.

Share via