It sure did !! THNX a lot !

This way we have the days blocked for selection but the user can still browse thru all the remaining months. It would be very nice it (for the same example: a camping site) if the not valid months would also be invisible. I could limit the year within the code, I would like to limit the months in an equal way. Somebody has a patch already?

Yeah that prety much works once I got a grip on what it was doing....

When I impliment your code suggestion, my variation shown below, I get some strange behavior:

Calendar.setup({
inputField : "matched_level1",
ifFormat : "%m/%d/%Y",
button : "f_trigger_a",
align : "Tr",
singleClick : true,
dateStatusFunc : dateStatus1
});
function dateStatus1(date) {
var min = new Date(2007,04,03); // Today's date...
var max = new Date(2008,04,03); // Year in the future...
if (date.getTime() < min.getTime() || date.getTime() > max.getTime()) {
return true; // true says "disable"
} else {
return false; // leave other dates enabled
}
}

The calendar displays fine but instead of dates between today (04/03/2007 in my example) and a year from now (04/03/2008) being selectable, the calendar only allows dates 1 month from now (05/03/2007) to a year + 1 month from now (05/03/2008).

Any idea why?

• b

Hello,

I have a form with two inputfields for a period. The First one is the from an the secend one is a to date. If the from date is chosen via the calendar I want the to calendar to disable every date < the from date.

My code for this looks like this:

                    <div id="content_input_epoch_start_lable" class="text">Von:</div>
                    <div id="content_input_epoch_start_input">
                        <input type="text" style="width:70px;height:13px;" name="f_date" class="solid" id="f_date" readonly="true" />&nbsp;
			<img id="f_trigger" style="vertical-align: -35%" src="http://travelload.de/partner/my-travelload.de/messagecenter/gfx/cal.gif">
                    </div>
                    <div id="content_input_epoch_stop_lable" class="text">bis:</div>
                    <div id="content_input_epoch_stop_input">
                        <input type="text" style="width:70px;height:13px;" name="t_date" class="solid" id="t_date" readonly="true" />&nbsp;
			<img id="t_trigger" style="vertical-align: -35%" src="http://travelload.de/partner/my-travelload.de/messagecenter/gfx/cal.gif">
                    </div>
                    <script type="text/javascript">


                        Calendar.setup({
                            inputField     :    "f_date",      // id of the input field
                            ifFormat       :    "%d.%m.%Y", // format of the input field
                            showsTime      :    false,         // will not display a time selector
                            button         :    "f_trigger",   // trigger for the calendar (button ID)
                            singleClick    :    true,          // single-click mode
                            step           :    1              // show all years in drop-down boxes (instead of every other year as default)
                        });
                        Calendar.setup({
                            inputField     :    "t_date",      // id of the input field
                            ifFormat       :    "%d.%m.%Y", // format of the input field
                            showsTime      :    false,         // will not display a time selector
                            button         :    "t_trigger",   // trigger for the calendar (button ID)
                            singleClick    :    true,          // single-click mode
                            step           :    1,              // show all years in drop-down boxes (instead of every other year as default)
                            dateStatusFunc : dateStatus
                        });

                        function dateStatus(date) {
                            var minDateString = document.getElementById("f_date").value;
                            var dateParts = minDateString.split(".");
                            var min = new Date(dateParts[2], dateParts[1] -1, dateParts[0]);
                            if (date.getTime() < min.getTime())
                                return true; // true says "disable"
                            else
                                return false; // leave other dates enabled
                        }
                    </script>

The disabling works fine, but if a from date is chosen the to calendar will not close after I clicked a date an does not fill a date to the Inputfield, unless I change the month or year (when I step back afterwards it works also fine).