Oct 14, 2012

Disabling days in Magento calendar

Sometimes you need to modify the way Magento calendar works, so the user can't choose a holiday or a weekend day. This is not specifically explained by the Magento community or documentation, so I decided to post it here.

My version of Magento is 1.7, just to let you know, but should work with others.

Let's say you call your calendar via javascript like this:

    <script type="text/javascript">
        //<![CDATA[
        Calendar.setup({
            inputField: "sdate",
            ifFormat: "%Y-%m-%d",
            showsTime: false,
            button: "_dob_trig",
            align: "Bl",
            singleClick: true      
        });      
        //]]>
    </script>      

Then you get a functional calendar, but the user can choose any day of the year, and that's something we want to prevent.

So, what you have to do is to add a "disableFunc"  function to this calendar setup.

disableFunc: function(date) {
 //return true if you want the day disabled, false otherwise
 ...
}

For example, you could do something like this to disable sundays (remember, in javascript's Date object, Sunday is 0, Monday 1, ... until Saturday that is 6!


    <script type="text/javascript">
        //<![CDATA[
        Calendar.setup({
            inputField: "sdate",
            ifFormat: "%Y-%m-%d",
            showsTime: false,
            button: "_dob_trig",
            align: "Bl",
            singleClick: true,

            disableFunc: function(date) {
                  //disable all sundays and New Year day
                  var month = date.getMonth() + 1; //add 1 because January = 0 and so on
                  var day = date.getDate(); //get day number
                  if (month==1 && day == 1) return true;
                  return date.getDay() == 0;  //0 for sunday, 1 for monday, etc
            }
     });
     //]]>
     </script>

So the code above checks (the disableFunc is called for every day in the current month displayed by the calendar!) if the day is 1-1, if so, the day is disabled. Otherwise, it checks if the day is a Sunday, and if so, the day is also disabled.

Hope this code helps you out with calendar manipulation in Magento!
 

1 comment:

  1. 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:
    //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; } }
    },
    }';

    Follow the link for full details:
    http://amit2k2.blogspot.in/2014/06/magento-disable-past-dates.html

    ReplyDelete