I'm working on a page that has multiple table rows which contain 2 instances of the Calendar each. Both instances use dateStatusFunc and local functions to specify whether the date is enabled or not and sets the style of the dates that are (valid starting and ending dates for a date range).

It works fine for the most part, except when you click on the enabled date, nothing happens. However, if you click on the Day header, which switches that day of the week to be the "first day" of the week (i.e. the calendar displays Sun-Sat by default, click on Friday and the calendar displays Fri-Thu), the enabled days start working.

Has anyone run into this problem?

*************************************************

<script language="javascript">
Calendar.setup({
    button: 'StartDS_1',
    inputField: 'StartTXT_1',
    ifFormat: '%m/%d/%Y',
    align: 'Bl',
    dateStatusFunc: function(date, y, m, d) { return ValidStart(y,m,d); },
    singleClick: true,
    electric: true
});
</script>

<script language="javascript">
Calendar.setup({
    button: 'EndDS_1',
    inputField: 'EndTXT_1',
    ifFormat: '%m/%d/%Y',
    align: 'Bl',
    dateStatusFunc: function(date, y, m, d) { return ValidStart(y,m,d); },
    singleClick: true,
    electric: true
});
</script>

/* Checks for Saturdays after 10 days from the current date */
function ValidStart(year,month,day)
{
    var chkDate = new Date(year,month,day);
    var curDate = new Date();
    var nextDate = new Date(curDate.valueOf() + 10*24*60*60*1000);
   
    if(chkDate.getDay() == 6)
    {
        if(chkDate > nextDate)
            return "zzz";
    }
    return true;
}

/* Checks for Fridays after 10 days from the current date */
function ValidEnd(year,month,day)
{
    var chkDate = new Date(year,month,day);

    var curDate = new Date();
    var nextDate = new Date(curDate.valueOf() + 10*24*60*60*1000);
   
    if(chkDate.getDay() == 5)
    {
        if(chkDate > nextDate)
            return "zzz";
    }
    return true;
}