在選定日期和今天日期之前禁用日期

Question

在報告中，我顯示startDate和endDate字段以使用jQuery ui datepicker選擇特定日期。對於startDate和endDate字段，我將今天日期作爲默認日期。我的要求是

1）如果客戶直接點擊endDate，則應該禁用今日日期之前和今日之後的日期。

2）如果客戶選擇startdate的任何特定日期，則結束日期選擇日期之前和今天日期之後的日期應被禁用。

我正在使用下面的代碼。

var dates = $("#startDate, #endDate").datepicker({ 
    defaultDate: "+1w", 
    dateFormat : 'dd-mm-yy', 
    changeMonth: true, 
    numberOfMonths: 1, 
    changeMonth: true, 
    changeYear : true, 
    numberOfMonths: 1, 
    maxDate: 0, 

    onSelect: function(selectedDate) { 
     var option = this.id == "startDate" ? "minDate" : "maxDate", 
     instance = $(this).data("datepicker"), 
     date = $.datepicker.parseDate(
      instance.settings.dateFormat || 
      $.datepicker._defaults.dateFormat, 
      selectedDate, instance.settings); 
     dates.not(this).datepicker("option", option, date); 
     } 
    }); 

如果我用這個我能做到第二個要求，但不是第一個。但是我需要實現這兩個條件。

我該怎麼做？

Answer 1

嘗試下面的內容，您需要調用函數來設置最短日期和最長日期，同時選擇開始日期和結束日期。

DEMO HERE

// To set mindate in enddate 
function customRange(input) 
{ 
return { 
     minDate: (input.id == "end_date" ? $("#start_date").datepicker("getDate") : new Date()) 
     }; 
} 

// To set maxdate in startdate 
function customRangeStart(input) 
{ 
return { 
     maxDate:(input.id == "start_date" ? $("#end_date").datepicker("getDate") : null) 
     }; 
} 

$(document).ready(function() { 

    $('#start_date').datepicker(
    { 
     beforeShow: customRangeStart, 
     minDate: 0, 
     dateFormat: "yy-mm-dd", 
     changeYear: true 
    }); 

    $('#end_date').datepicker(
    { 
     beforeShow: customRange, 
     dateFormat: "yy-mm-dd", 
     changeYear: true 
    }); 
});