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

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 
    }); 
});