Ajax: CalendarExtender

In this blog, I will explain how to use Ajax Calendar extender control in ASP.NET.

In my previous blog, I explained how to use ajax:FilteredTextBoxExtender and its properties. And now you will learn how to set a date picker in asp.net textbox using ajax:CalendarExtender.

 

Steps:

• First Create a new "Empty ASP.NET Web Application".
• Add reference (ajaxcontroltoolkit.dll) to your project.
• Add webform to your project.

Next write following line in your aspx page.

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxtoolkit" %>

 

Next goto ToolBox -> Ajax Extensions -> drag and drop  a script manager on the design page (.aspx). 

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

Similarly drag and drop one textbox on the design page. 

<asp:TextBox ID="txtDOB" runat="server"></asp:TextBox>

Next copy the  following script. 

<ajaxtoolkit:CalendarExtender
   ID="ceDOB"
   runat="server"
   Enabled="True"
   TargetControlID="txtDOB"
   Format="dd-MM-yyyy">
</ajaxtoolkit:CalendarExtender>

Then validate the textboxes by using  ajax : FilteredTextBoxExtender.  

<ajaxtoolkit:FilteredTextBoxExtender
   ID="fteDOB"
   runat="server"
   TargetControlID="txtDOB"
   FilterMode="ValidChars"
   ValidChars="0123456789-/:">
</ajaxtoolkit:FilteredTextBoxExtender>

Thats it. Please provide your valuable suggestions and feedback if you found this article is helpful.