---
title: "Ajax Toolkit CalendarExtender Control in ASP.Net"  
description: "TheAJAX ControlToolkit has a  CalendarExtender control that pops up a calendar whenever the user clicks on  the target control.  Calendar Properties:T"  
author: "Anonymous User"  
published: 2010-12-06  
updated: 2020-03-04  
canonical: https://www.mindstick.com/articles/257/ajax-toolkit-calendarextender-control-in-asp-dot-net  
category: "ajax"  
tags: ["ajax"]  
reading_time: 2 minutes  

---

# Ajax Toolkit CalendarExtender Control in ASP.Net

The AJAX Control Toolkit has a CalendarExtender control that pops up a calendar whenever the user clicks on the target control.\

##### Calendar Properties:

**TargetControlID -** The ID of the TextBox to extend with the calendar.\
**CssClass -** Name of the CSS class used to style the calendar\
**Format -** Format string used to display the selected date.\
**PopupButtonID -** The ID of a control to show the calendar popup when clicked. If this value is not set, the calendar will pop up when the textbox receives focus.\
**PopupPosition -** Indicates where the calendar popup should appear.\
**SelectedDate -** Indicates the date the Calendar extender is initialized with.

##### Code:

##### Write these codes on default.aspx page

```
<%--
ScriptManager control manages client script for AJAX enabled ASP.NET pages.This
enables partial-page rendering and Web-service calls.You have to used this if
you want to use ajax control toolkit--%><asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager><%--Add the calender control here--%><cc1:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="TextBox1" Animated="true"></cc1:CalendarExtender><%--Add the two label,
textbox(Apply the Calender extender on it) and button control here--%> <asp:Label ID="Label1" runat="server" Text="Date"></asp:Label><asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br /><asp:Button ID="Button1" runat="server" Text="submit" onclick="Button1_Click" /><br /><br /><asp:Label ID="Label2" runat="server"></asp:Label>Write these code on button click eventprotected void Button1_Click(object sender, EventArgs e)    {         Label2.Text = TextBox1.Text; // Show the date in label     }
```

##### Run the project

![AjaxControl Toolkit CalendarExtender Control in ASP.Net](https://www.mindstick.com/mindstickarticle/a18d7f93-47f5-4aeb-bb6c-6bfb847b1df9/images/ae638d64-5685-418e-b3a2-be83f424c961.png)\

When we click on textbox it populate the CalendarExtender control

![AjaxControl Toolkit CalendarExtender Control in ASP.Net](https://www.mindstick.com/mindstickarticle/a18d7f93-47f5-4aeb-bb6c-6bfb847b1df9/images/ae5c2139-ce36-493e-b47f-b485d84dc0bb.png)

Selecting any date from CalendarExtender control

![AjaxControl Toolkit CalendarExtender Control in ASP.Net](https://www.mindstick.com/mindstickarticle/a18d7f93-47f5-4aeb-bb6c-6bfb847b1df9/images/e63f8d47-6310-46a6-93d5-34b08740c343.png)

\

---

Original Source: https://www.mindstick.com/articles/257/ajax-toolkit-calendarextender-control-in-asp-dot-net

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
