AjaxCalendarExtender

AjaxCalendar is an ASP.NET AJAX extender that can be attached to any ASP:TextBox control to provide client-side date-picking functionality with customizable date-format and provide an UI in a popup control. You can interact with these calendar by selecting on a day to set the date, or ‘Today’ link to set the current date.

Some important properties of AjaxCalendarExtender:

  1. TargetControlID: The ASP:TextBox control ID where want to show calendar when user click on TextBox.

  2. DefaultView: Default view of the calendar when it first popup (Days, Months or Years).

  3. PopupPosition: It indicate where you want the calendar displayed (bottom, left, top or right).

  4. StartDate: Minimum date that user can select.

  5. EndDate: Maximum date that user can select.

  6. SelectedDate: Date to be initially filled in TextBox.

Aspx Page coding:

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
  3. <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7. <title></title>
  8. </head>
  9. <body>
  10. <form id="form1" runat="server">
  11. <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
  12. </asp:ToolkitScriptManager>
  13. <div>
  14. <asp:CalendarExtender ID="CalendarExtender1" runat="server"
  15. TargetControlID="txtDate" PopupPosition="Right" EndDate="8/10/2015"
  16. StartDate="2012-03-03" TodaysDateFormat="d MMMM, yyyy"
  17. SelectedDate="8/10/2015">
  18. </asp:CalendarExtender>
  19. <asp:TextBox runat="server" ReadOnly="true" ID="txtDate">
  20. </asp:TextBox>
  21. </div>
  22. </form>
  23. </body>
  24. </html>
Output

Calendar

Note: You need to use the Ajax Control Toolkit library.