Hi, I have a problem trying to disable the date selection of a calendar control from javascript.

In addition to the Calendar, I have a dropdownlist, some textboxes and an "Update Textboxes" button on the page.

Initially in the original page definition, I have the dropdownlist and the calendar enabled and the button is disabled. When users enter data into the textboxes I have a javascript function that validates the entry and does some additional client side manipulations and when the user exits a textbox the onBlur event does some processing.

The textbox data will be updated to a database when the "Update Textboxes" button is clicked. Therefore, the button is disabled until there is valid data to update, and at that point I want to disable postbacks from the dropdownlist and the calendar, and enable the button postback.

My code works fine for the dropdownlist and the button, but the calendar dates all allow clicking and do a postback. The dropdownlist is grayed out and won't allow a dropdown, the button goes from gray to enabled, and the dates on the calendar go to gray as if the control was disabled, but when you roll the mouse over a date, the pointer changes to a hand and if you click, it performs a postback.

Here's the javascript code:

document.getElementById("DropDownList1").disabled = true; (works fine)
document.getElementById("Calendar1").disabled = true; (only grays)
document.getElementById("btnUpdate").disabled = false; (works fine)

I've also tried setting the Calendar SelectionMode to None, and 0 and "None" and "0" but that doesn't do anything.

I've spent more hours than I care to admit searching Google with combinations of the keywords javascript, asp.net, Calendar, disable, enable, SelectionMode.

I wouldn't be against looping through a list of the days in the calendar and setting each one to disabled, but that also doesn't seem possible.

Any help would be greatly appreciated.

Thank you.

Bob

Override the DayRender event, and within it, I believe that you do:

e.Day.IsSelectable = false

Brian

Hi Brian,
What I need is something on the client side that disables the Calendar control so that a click on any date will not result in a __doPostBack. The DayRender event handler is a server side function.

Right now I am hooking into the client side of the textbox control and if the text in that box is changed I, through a javascript function, enable the Update button (which works) and I disable the DropDownList (which works), and I try to disable the Calendar control, but all the disable on the Calendar does is set all the text, including each day number in the Calendar to a gray, disabled look, but still allows the user to click on the day number and start a postback to the server.

In the javascript function, I can set the visible property of the Calendar to "hide" and it disappears which won't allow the user to effect a postback, but I'm trying to keep the Calendar in view, just not available for clicking.

Thanks for the reply.

Bob

Hey,

Well, if you look at the javascript, you must be able to determine all of the ID's of the javascript links, then yes you could do something like that. If those links don't have any id's, then you might not be able to access it.

Brian

I've found a solution that mostly works. As asp.net renders the calendar control there is a dayRendered event that is fired for each individual day as it is rendered. In this event, I instantiate a new hyperlink control for the day, load it with the day number, backcolor and forecolor of the day that asp.net created, then I delete the control that asp.net created from the cell and then add an ID to the new hyperlink and add it to the cell. In effect, adding an ID to the anchor control that asp.net created.

This then gives me the ability to identify the day in the javascript (from the new ID) and to loop through all the days in the calendar and set the "href" values to "#" rather than "javascript:__doPostBack('Calendar','nnnn')". This keeps the browser from doing the postback, and remains on the current page.

The only remaining problem is that the previous month and next month also have the javascript:__doPostBack and don't seem to have an event when they are rendered to allow me to, in effect, attach an ID so that I can find it on the javascript side when I need to. I may have to just settle for that, or pull the prev and next months off the calendar, or write the whole thing in javascript rather than use the asp.net server control.

Thanks for the replies.

Bob

Thank you Brian. Your replies help point me into the right direction.