How do I disable dates previous to YUI3 Calendar minimumDate?

Question

According to the documentation , setting the minimumDate of a calendar will "reset any date any earlier date to this date", but I would like to disable the selection of any previous dates. The control disables the "previous" month button for the month of the minimum date, but still allows selection of earlier dates.

Answer 1

Not having found a solution after some searching, I am posting one I finally came up with. Using the calendar's disabled dates rules , I created the following:

YUI().use('calendar', function (Y) {

    var calendar, rules,
        settings = { contentBox: '#dueDateSelect', minimumDate: new Date() };

    function getDisabledDatesRule(date, name) {
        var year = date.getFullYear(), 
            month = date.getMonth(), 
            daybefore = date.getDate() - 1, 
            r = {};
        r[year] = {};
        r[year][month] = {};
        r[year][month]['1-' + daybefore] = name;
        return r;
    }

    if (settings.minimumDate) {
        settings.disabledDatesRule = 'days-before-min';
        rules = getDisabledDatesRule(
            settings.minimumDate, 
            settings.disabledDatesRule
        );
    }

    calendar = new Y.Calendar(settings).render();

    if (rules) {
        calendar.set("customRenderer", {
            rules: rules
        });
    }

});

Answer 2

I did it in a easier way, i hope it helps you:

    //Setting the date to today's date.  
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth(); //January is 1
var yyyy = today.getFullYear();


var calendar = new Y.Calendar({
  contentBox: "#mycalendar",
  width:'340px',
  showPrevMonth: true,
  showNextMonth: true,
  minimumDate: new Date(yyyy, mm, dd) , 
  date: new Date()}).render();

Answer 3

I know you've asked about YUI3 Calendar, but only if you need a second option, you'll probably want to test JSCal2 I finally understood how to accomplish this with it: All you need to do it's to use the present day as "min" so today it's the first selectable day! Copy and paste this, it works:

<input size="40" id="cal_txt_date" />
<button id="cal_btn">...</button>
<br />
<script type="text/javascript">//<![CDATA[ 
  var now = new Date();
  var cal = Calendar.setup({ min : now, trigger : "cal_btn", });
  cal.manageFields("cal_btn", "cal_txt_date", "%A %e de %B del %Y a las %I:%M %p");
//]]>
</script>

As you can see a new date object it's created in the variable "now", and it is set to "min" (or max if future dates shouldn't be selected) I hope this helps you =) If you paste my code as it is here, it should work with JSCal2.