如何禁用YUI3 Calendar minimumDate之前的日期？

Question

根據文檔 ，設置日歷的minimumDate將“重置任何更早的日期到此日期”，但我想禁用以前任何日期的選擇。 該控件禁用最小日期月份的“上一個”月份按鈕，但仍允許選擇較早的日期。

Answer 1

經過一些搜索后沒有找到解決方案，我發布了一個我終於想出來的。 使用日歷的禁用日期規則 ，我創建了以下內容：

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

我以一種更簡單的方式做到了，我希望它可以幫助你：

    //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

我知道你已經問過YUI3日歷，但是只有當你需要第二個選項時，你可能想要測試JSCal2我終於明白了如何用它完成這個：所有你需要做的就是用現在作為“ min“所以今天是第一個可選擇的日子！ 復制並粘貼它，它的工作原理：

<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>

正如你可以看到它在變量“now”中創建的新日期對象，它被設置為“min”（如果不應該選擇未來的日期，則為max）我希望這可以幫助你=）如果你將我的代碼粘貼為它在這里，它應該與JSCal2一起使用。