jQuery datetimepicker例外日与minDate和maxDate

Question

我面临datetimepicker问题。

我有一个订单页面，有一个交货日期。

无论何时列出订单，datetimepicker都有一定的价值（例如，上周的某一天）。我希望能够对其进行编辑，但只能选择一组可用日期（从今天到最多30天，包括“上周某天”）。 我应该如何继续？

功能机械手的：

var maxdate = new Date(); 
maxdate.setDate(maxdate.getDate() + 30); 
var $p = jQuery.noConflict(); 
$p("#foo").datetimepicker({ 
     format: 'YYYY/MM/DD', 
     useCurrent:true, 
     showClose:true, 
     defaultDate: $.now(), 
     minDate: moment().millisecond(0).second(0).minute(0).hour(0), 
     maxDate:maxdate, 
}); 

编辑：

我猜我也不是很明确的跟我的问题。

示例我想要什么：

的minDate = 2017年10月14日

的maxDate = 2017年10月30日

（在这一点上，一切工作正常）

日期选项我想要选择= 2017/09/10（即比minDate大1个月）而不更改minDate！

我想创建一个不在最小/最大日期范围内的例外日期。

Answer 1

对于显示的选项，我猜你正在使用eonasdan-datetimepicker。

所以这样进行：

var maxDate = moment().add(30, 'day'); 
var $p = jQuery.noConflict(); 
$p("#foo").datetimepicker({ 
     format: 'YYYY/MM/DD', 
     useCurrent: true, 
     showClose: true, 
     defaultDate: $p.now(), 
     minDate: moment().startOf('day'), 
     maxDate: maxDate, 
}); 

凡maxDate将使用矩量法.add() 加入30天的minDate这是比较容易，如果你使用startOf('day')，这将是你有相同的，但更容易阅读。

这里提琴生产它：https://jsfiddle.net/William_/2ze7bo27/

编辑

行，所以你想要的是让你的用户选择了“特殊的日子”，也就是不在数组中，这样对于你可以使用enabledDates选项。

在其中您可以添加特殊的日子和启用，只有这样的日子范围将被允许进行选择，并会是这样的：

var maxDate = moment().add(30, 'day'); //To the picker not allow to go further in the view 
var startDate = moment().startOf('day').format('YYYY/MM/DD'); //First date being add that's current day 
var enabledDates = [ 
    moment('2017/09/10', 'YYYY/MM/DD'), //this is our "special day" 
    moment(startDate, 'YYYY/MM/DD') // we format our day to the format of picker 
]; 

//Iterate and add 30 days, and only those will be able to be picked 
for (var i = 1; i <= 30; i++) { 
    //Here we give the need it format 
    let date = moment().add(i, 'day').format('YYYY/MM/DD'); 
    enabledDates.push(moment(date, 'YYYY/MM/DD')); 
} 
console.log(enabledDates); //Show the enable dates, just to confirm 

//We init our picker with the 30 days and our special date 
//`minDate` and `maxDate` still there to give the style to the view 

var $p = jQuery.noConflict(); 
$p("#myDatepicker").datetimepicker({ 
    format: 'YYYY/MM/DD', 
    useCurrent: false, 
    showClose: true, 
    minDate: moment('2017/09/10', 'YYYY/MM/DD'), 
    maxDate: maxDate, 
    enabledDates: enabledDates, 
}); 

工作拨弄https://jsfiddle.net/William_/2ze7bo27/1/