CalendarExtender Validation

With the Ajax Control Toolkit, developing Ajax-enabled ASP.NET Web Forms applications becomes remarkably streamlined. The toolkit facilitates the process by allowing developers to effortlessly drag and drop Toolkit controls from the Visual Studio Toolbox onto an ASP.NET Web Forms page.

Ajax Control Toolkit

One of the notable controls in the Ajax Control Toolkit is the CalendarExtender. This control offers exceptional ease of use, as it can be seamlessly associated with both TextBox and Button controls. By simply configuring the CalendarExtender control, developers can establish a smooth integration with a TextBox control, enabling users to conveniently select dates from a visually appealing calendar interface. Similarly, the CalendarExtender control can be effortlessly linked with a Button control, providing an alternative mechanism for users to access and interact with the date selection feature.


This intuitive drag-and-drop approach, combined with the versatile functionality of the CalendarExtender control, empowers developers to enhance the user experience of their ASP.NET Web Forms applications by effortlessly incorporating interactive and responsive date selection capabilities into TextBox and Button controls.

As in the codes below a custom javascript and Ajax calendarcontrol validation to check the validity of a date input by the client user is implemented. The client side code will be verified by JavaScript , thus providing the security

function verifyDate(sender,args){ var d = new Date(); d.setDate(d.getDate() - 1); if (sender._selectedDate < d) { alert("Date should be Today or Greater than Today"); sender._textbox.set_Value('') } }

You can copy and paste the following source code and run the program. To use the Ajax Control Toolkit in your Visual Studio project, you should add reference to the AjaxControlToolkit.dll in your project.


<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> <html xmlns=""> <head id="Head1" runat="server"> <title>Untitled Page</title> <script type="text/javascript"> function verifyDate(sender,args){ var d = new Date(); d.setDate(d.getDate() - 1); if (sender._selectedDate < d) { alert("Date should be Today or Grater than Today"); sender._textbox.set_Value('') } } </script> </head> <body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:Label ID="Label1" runat="server" Text="Click Select Date Button to view Calendar"></asp:Label> <br /> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <asp:Button ID="Button1" runat="server" Text="Select Date" /> <asp:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="TextBox1" PopupButtonID="Button1" OnClientDateSelectionChanged="verifyDate" /> </div> </form> </body> </html>