Post
Ask Question

Ajax: CalendarExtender

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.

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

 

Next goto ToolBox -> Ajax Extensions -> drag and drop  a script manager on the design page (.aspx). 
  1. <asp:ScriptManager ID="ScriptManager1" runat="server">  
  2. </asp:ScriptManager>  

Similarly drag and drop one textbox on the design page. 
  1. <asp:TextBox ID="txtDOB" runat="server"></asp:TextBox>  
Next copy the  following script. 
  1. <ajaxtoolkit:CalendarExtender  
  2.    ID="ceDOB"    
  3.    runat="server"    
  4.    Enabled="True"    
  5.    TargetControlID="txtDOB"    
  6.    Format="dd-MM-yyyy">    
  7. </ajaxtoolkit:CalendarExtender>   
Then validate the textboxes by using  ajax : FilteredTextBoxExtender.  
  1. <ajaxtoolkit:FilteredTextBoxExtender  
  2.    ID="fteDOB"    
  3.    runat="server"    
  4.    TargetControlID="txtDOB"    
  5.    FilterMode="ValidChars"    
  6.    ValidChars="0123456789-/:">    
  7. </ajaxtoolkit:FilteredTextBoxExtender>  

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