In this article I will explain how to disable Past or Previous Dates in AJAX Control Toolkit CalendarExtender Control.
As we all know directly there is no provision to disable past or previous dates in AJAX Control Toolkit CalendarExtender Control, hence I have developed a script that will do the job for you. You just need to follow the simple steps shown below.
HTML Markup
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<link href="CSS.css" rel="stylesheet" type="text/css" />
<script src="Extension.min.js" type="text/javascript"></script>
<asp:TextBox ID="txtDate" runat="server" CssClass="disable_past_dates" />
<asp:ImageButton runat="server" ID="imgPopup" ImageUrl="~/Calendar.png" />
<cc1:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="txtDate"
PopupButtonID="imgPopup" />
</form>
</body>
</html>
Disabling Past Dates
In order to disable past dates we need to follow 2 simple steps.
1. Add CSS.css and Extension.min.js files just below the ScriptManager as shown in the HTML Markup above.
2. Set the CssClass property to disable_past_dates for the TextBox control associated with the CalendarExtender for which you want to disable the past dates.
That’s it you need to do and your AJAX CalendarExtender will now disable the past dates.
Demo
Downloads
