使用datePicker禁用基于先前填充的日期UI日期

Question

我有一个编辑屏幕，其中在我的开始日期和结束日期是从数据库中预先填充的。该控件是一个UIdatePicker插件。我想根据来自服务器的开始日期限制/禁用以前的日期。此外，当我更改日期时，我希望结束日期从开始日期后的一天开始。由于首先填充值，然后将控件添加到输入字段，因此我无法控制它。

任何帮助都将不胜感激。代码如下：

for(var i =0; i<abcd.length; i ++)
{
  $("#startDate input").val(StartDate);
  $("#endDate input").val(EndDate);
 $(".datePicker").datepicker();
}

Answer 1

您可以尝试以下代码来设置动态最小和最大日期范围。

 $("input.DateFrom").datepicker({
      beforeShow: customRange 
    });

function customRange(input) {
    //make use of parameter-input if you use this fuction more places
    //write some logic to deside min,max date and return
    var minimumDate = new Date();//or assign value from database and make sure date-format also
    var maximumDate = new Date();
    maximumDate.setDate(minimumDate.getDate()+20);

    return { minDate: minimumDate,
        maxDate: maximumDate
    };
}

或者，如果要将最小日期和最大值设置为某个常量范围，可以考虑以下代码：

    $("input.DateFrom").datepicker({
        minDate: 0,
        maxDate: "+1M +10D" 
    });

参考：jQuery UI日期选择器最小值最大值

SO答案-根据其他日期输入值限制一个日期输入

JSFIDLE演示