Home / ASP.NET Wiki / Javascript / AJAX / AJAX Control Toolkit / Calendar Extender

Calendar Extender

 Rate It (23)

The AJAX Control Toolkit has a CalenderExtender extender control that pops up a calendar whenever the user clicks on the target control, or a popup control.  The extender is commonly used to popup a calendar for a TextBox , like in an airline reservation system when selecting the from and to dates.  The calendar extender can work by targeting a TextBox control directly, like so:

<asp:TextBox ID="txt1" runat="server" />
<ajax:CalendarExtender ID="cal1" runat="server" PopupButtonID="txt1"  TargetControlID="txt1" />

In this mode, the calendar extender appears when the TextBox is clicked on.  Clicking out of the TextBox hides it.  (Note: This inexplicably annoying behavior was corrected with AJAX version 3.  Clicking a date now hides the calendar.) 

The extender also can take a PopupButtonID reference to a button that can be clicked.  When the button is clicked, it shows the calendar; clicking on the button again hides it.

The calendar extender can switch to year/decade view by clicking on the header.  Clicking the first time brings up a list of months; clicking again brings up a list of years.  The left and right arrow buttons also page through the months or years.

The Calendar Extendar supports localization ,and you can  localize it by setting the  EnableScriptGlobalization Script Manager property to  true , this way the calendar extendar will display its contents based on the current page culture.

 

Calendar extendar Live Demo.

Revision number 5, Sunday, June 20, 2010 9:16:00 AM by anjankant

Comments

SGWellens, you wrote "This inexplicably annoying behavior was corrected with AJAX version 3. Clicking a date now hides the calendar" . What do you mean by that ? I think its also fixed in the toolkit version 1.1 ,because when we click a date in the calendar it hides it .

I agree with anas

Where can i download ajax toolkit?

hi, i also try CalendarExtender and it is nice to use. But now i have a question: I want save the date i have choosen into database. How can i do that? I mean is what is the code to get the date i have choosen and make sure it is in DateTime format?

How to validate the calendar Date should allow only Current Date to 30 days. Please help me as soos as possible

How to validate the Ajax calendar Date should allow only Current Date to 30 days. Please help me as soon as possible

Ajax control toolkit download link http://ajaxcontroltoolkit.codeplex.com/releases/view/33804

I have one calendar extender(fromdate) and in database i want to store from date and to date... when user selects particular from date, the previous todate should get reflected in database how to do

I suggest you all to use some javascript/jquery calendar unless you have some specific reason or need to do with the asp.net calendar.

Related Articles

AJAX Control Toolkit

Learn how to extend your ASP.NET AJAX applications using the ASP.NET AJAX Control Toolkit. ASP.NET AJAX Control Toolkit: Installation and getting started is a video that starts with the basics, including downloading and installing the toolkit. Blog Posts Four

AJAX Extenders

ASP.NET AJAX can be easily extended to create almost any control you can imagine. Be sure to take a look at the ASP.NETAJAX Control Toolkit. Blog Posts ASP.NET AJAX SliderExtender Layout and Custom Appearance: Alessandro Gallo describes how to customize the

TargetControlID Property

The TargetControlID is one of the key properties with the AJAX Control Toolkit. Being a property defined on the control extenders, this property signifies the control that the extender extends. It has to meet the ID of the control it wants to extend. It's

AJAX

Asynchronous JavaScript and XML - It's Ajax and it's everywhere. Start at the ASP.NET Ajax site and work from there...there's a ton of resources at your disposal. Ajax Showcase - Check out some of the great sites that been built using Ajax. Ajax

Shortcuts

Table of Contents

Top Wiki Contributors

(last 30 days)

  1. proffy (1)
  2. primillo (1)