I have a table in the database which contains some dates. I want to disable those dates in magento default calendar. The calendar is in front-end checkout process (used to add delivery date for the order). Any suggestions will be appreciated.

I'm using Magento CE 1.7

2 Answers 2


Have not done this myself, so this is a guide to get you in the right direction.

the calendar used by magento is located here : /js/calendar/calendar.js, and from its header comments, you will find it is done by http://www.dynarch.com/, and the docs is located here : http://www.dynarch.com/jscal

You will see there is built in functionality (via a callback) to disable dates. (http://www.dynarch.com/jscal/#sec8)

You can also disable individual dates by supplying a callback function which receives a JS date object and returns true if that date must be disabled, or false otherwise. .....suppose you have in your database a list of dates that should be disabled, just convert them to numeric value and build up a hash table, then your disabled() handler can very conveniently return true for them:

(sound just like what you want/have ;) )

    20090502: true,
    20090505: true,
    20090510: true,
    20090511: true
    cont     : "sample3",
    disabled : function(date) {
        date = Calendar.dateToInt(date);
        return date in DISABLED_DATES;

To extend magento calendar creation, you need to create your own class, which extends the core Varien_Data_Form_Element_Date class, which will allow you to adjust the setup for the calendar, and include your dates. You will need to override the getElementHtml() method, which contains the calandar setup script code.

$html .= sprintf('
            <script type="text/javascript">
                    inputField: "%s",
                    ifFormat: "%s",
                    showsTime: %s,
                    button: "%s_trig",
                    align: "Bl",
                    singleClick : true
            $this->getHtmlId(), $displayFormat,
            $this->getTime() ? 'true' : 'false', $this->getHtmlId()

and include the callback and dates you have, as per the calendar docs.

I am not sure how you are displaying the calendars in your site, but one way to use the custom class in a form is to create a custom form element as such:


Hope this helps you in the right direction.

  • Thank you for your response. I'll try on this and if it worked I'll put the source here.
    – Sukeshini
    Commented Sep 26, 2013 at 16:03
  • How did this go? Got it working?
    – ProxiBlue
    Commented Oct 13, 2013 at 4:28

Now We will DISABLE past Dates. Solution:

app/code/core/Mage/Core/Block/Html/Date.php (it is advisable to add custom calendar template, as in any upgrade you will lose your modifications)

Use the folowing to disable the previous dates:

           var calendarSetupObject = {
                inputField  : "' . $this->getId() . '",
                ifFormat    : "' . $displayFormat . '",
                showsTime   : "' . ($this->getTime() ? 'true' : 'false') . '",
                button      : "' . $this->getId() . '_trig",
                align       : "Bl",
                singleClick : true,
                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; } }
  • This will disable all of the past days and also all of the days before the current day from the future months from next year and after :) Commented Sep 21, 2017 at 7:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.