How to Disable Selected Dates dynamically from the Calendar Control

• Download CalendarTest.zip - 22.9 KB

Introduction

The calendar control is part of the dot net web controls collection. Its in the namespace System.Web.UI.WebControls. It provides an efficient mechanism for the user to to select dates in the desired format.But one of the functionality that we require most of the time, as part of validation is to disable a range of dates. Mostly we weould like to disable past dates so that user wont select them. This can be done with a little bit of tweaking. I will explain this in my article.

The DayRender event :

The most important event for us in this scenario, is the OnDayRender event. This event fires when the calendar is first rendered on the screen. This happens as a loop, wherein it continuously renders each day, one a time.

We have to write our logic in the OnDayRender event hanlder, to disable rendering when the day matches our criteria.

The Code:

In my code, I have a calendar control. I want to block it for all past days as well as next 7 days. I set this value in a local variable,nDaysToBlock.

As you can see from the code, all the action happens in the DayRender event handler.

<code>

protected void myDayRenderMethod(object sener, DayRenderEventArgs e)

{

if (e.Day.Date < (System.DateTime.Now.AddDays(_nDaysToBlock)))

{

e.Day.IsSelectable = false;

e.Cell.Font.Strikeout = true;

}

}

</code>

Here, iam checking if the day being rendered is less than the current day plus number of days to block. i.e, is it less than 7 days from now. In that case, we want to block such a day from being rendered, which is done by making e.Day.IsSelectable as false;

That is all there is to it. You have the desired dates disabled. You can change the font to strike out, so as to easily distinguish them.

The calendar will look as below at runtime, with selected dates disabled.

<shapetype id="_x0000_t75" stroked="f" filled="f" path="m@4@5l@4@11@9@11@9@5xe" o:preferrelative="t" o:spt="75" coordsize="21600,21600"><stroke joinstyle="miter"><formulas /><f eqn="if lineDrawn pixelLineWidth 0"><f eqn="sum @0 1 0"><f eqn="sum 0 0 @1"><f eqn="prod @2 1 2"><f eqn="prod @3 21600 pixelWidth"><f eqn="prod @3 21600 pixelHeight"><f eqn="sum @0 0 1"><f eqn="prod @6 1 2"><f eqn="prod @7 21600 pixelWidth"><f eqn="sum @8 21600 0"><f eqn="prod @7 21600 pixelHeight"><f eqn="sum @10 21600 0"></formulas /><path o:connecttype="rect" gradientshapeok="t" o:extrusionok="f"><lock aspectratio="t" v:ext="edit"><shape id="_x0000_i1026" style="WIDTH: 246pt; HEIGHT: 192pt" type="#_x0000_t75"><imagedata src="file:///C:\DOCUME~1\PRASHA~1.RAY\LOCALS~1\Temp\msohtml1\01\clip_image001.png"><group id="_x0000_s1026" style="WIDTH: 6in; HEIGHT: 252pt" coordsize="7200,4320" coordorigin="2527,847" editas="canvas"><lock aspectratio="t" v:ext="edit"><shape id="_x0000_s1027" style="LEFT: 2527px; WIDTH: 7200px; POSITION: absolute; TOP: 847px; HEIGHT: 4320px" o:preferrelative="f" type="#_x0000_t75"><fill o:detectmouseclick="t"><path o:connecttype="none" o:extrusionok="t"><lock v:ext="edit" text="t"><wrap type="none"><anchorlock>

Hope my code snippet was of help to you.

Thanks.