Displaying a Simple Popup Calendar
In this tutorial, you learn how to display a popup calendar when someone moves focus to a TextBox.
This tutorial will be split into three steps as follows: Add a ToolkitScriptManager, Add a TextBox control, Add an CalendarExtender.
This tutorial assumes you have already completed the previous tutorial on installing the Ajax Control Toolkit. If you have not please reference that first.
Step 1 – Add the ToolkitScriptManager
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
Step 2 – Add A Textbox Control
In design view, drag a text box control onto the page from the standard tab of the toolbox
Change the ID of the textbox to txtStartDate
The source code can be found below
<asp:TextBox ID="txtStartDate" runat="server"></asp:TextBox>
Step 3 – Add a Calendar Extender
Add the following control to your page from the Ajax Control Toolkit.
<asp:CalendarExtender
ID="CalendarExtender1"
TargetControlID="txtStartDate"
runat="server" />
Test your application and if functioning properly you should have a calendar widget that automates from the textbox when that textbox is selected.
