I have a problem to customise the Magento calendar in frontend: I want to disable the days before today, that's already works, but I can't select dates in the actual month.

But, If I click any of the date in next month and returns to the present month, then I can select the dates!!!!!!

Here is my code:

function disabledDate(date) {
    var today = new Date();
    if(date <= today){
        return true;
    } else {
        return false;
    }
};
Calendar.setup({
    inputField : 'date',
    ifFormat : '%e/%m/%Y',
    button : 'date_from_trig',
    align : 'Bl',
    singleClick : true,
    dateStatusFunc : disabledDate 
}); 

Thanks for help.

I have a problem to customise the Magento calendar in frontend: I want to disable the days before today, that's already works, but I can't select dates in the actual month.

But, If I click any of the date in next month and returns to the present month, then I can select the dates!!!!!!

Here is my code:

function disabledDate(date) {
    var today = new Date();
    if(date <= today){
        return true;
    } else {
        return false;
    }
};
Calendar.setup({
    inputField : 'date',
    ifFormat : '%e/%m/%Y',
    button : 'date_from_trig',
    align : 'Bl',
    singleClick : true,
    dateStatusFunc : disabledDate 
}); 

Thanks for help.

• javascript
• magento
• datepicker
• prototype

5 Answers 5

Problem solved like this:

        function disabledDate(date) {
            var today = new Date();
            var dd = today.getDate();
            return date.getDate() < dd ;                    

        };

Hope that it helps someone :)

disableFunc: function(date) {
                  var now= new Date();

                if(date.getFullYear()<now.getFullYear())
                {
                    return true;
                }
                if(date.getFullYear()==now.getFullYear())
                {
                    if(date.getMonth()<now.getMonth())
                    {
                        return true;
                    }
                }
                if(date.getMonth()==now.getMonth())
                {
                    if(date.getDate()<now.getDate())
                    {
                        return true;
                    }
                }

You can disable prevous days as well as any of the day in ing or current month.

In disableFunc 0 is for Sunday to disable 1 for Monday 2 for Tuesday and so on.

Following is the code.

function dateRange(date) {
                        var now = new Date();
                        return (date.getTime() <= now.getTime() )
                      }

                     Calendar.setup({
                          inputField  : "aw_sarp_subscription_start",
                          ifFormat    : "%m/%e/%Y",
                          dateStatusFunc : dateRange,
                          button      : "aw_sarp_subscription_start_trig",
                          align       : "Bl",
                          disableFunc : function(date){
                                return date.getDay() === 0;
                              },
                          singleClick : true
                    });

To disable previous and uping days from calendar , EX : To disable all previous days and uping weekends ,

<input type="text" class="datepicker" id="datepicker" name="shipment_date" />
<img id="_datepicker" src="<?php echo $this->getSkinUrl('images/img.gif');?>" alt="calendar" width="20" height="24" border="0">

//<![CDATA[

function disabledDate(date){
    var now= new Date();
    if(date.getFullYear()   <   now.getFullYear())  { return true; }
    if(date.getFullYear()   ==  now.getFullYear())  { if(date.getMonth()    <   now.getMonth()) { return true; } }
    if(date.getMonth()      ==  now.getMonth())     { if(date.getDate()     <   now.getDate())  { return true; } }
    if (date.getDay() == 0 || date.getDay() == 6) {
            return true;
        } else {
            return false;
        }
};

Calendar.setup({
    cont: "datepicker",
    inputField : 'datepicker',
    button : '_datepicker',
    dateStatusFunc : disabledDate ,
});
//]]>

I hope for someone this script will help:

<script type="text/javascript">
    Calendar.setup({
        inputField: 'your_input_field',
        ifFormat: '<?php echo $this->getDateTimeFormat();?>',
        button: 'you_button',
        showsTime: true,
        align: 'Bl',
        singleClick: true,
        disableFunc: function(date) {
        //disables all dates before current date 
            var now = new Date();
            if(date.getFullYear() < now.getFullYear()){
                return true;
            }
            if(date.getFullYear() == now.getFullYear() && date.getMonth() < now.getMonth()){
                return true;
            }
            if(date.getMonth() == now.getMonth() && date.getDate() < now.getDate()){
                return true;
            }
        }
    });
</script>