如何在jQuery datetimepicker中禁用所选日期和时间

时间:2016-11-02 00:44:35

标签: jquery datetime datetimepicker

我正在使用jQuery datetimepicker。添加日期选择器以预订日期和时间。这是它应该如何工作。

从周日到周六启用日期选择器,周三除外,时间是早上8点到下午6点 星期二可用时间是早上8点到下午2点

如果有人预订了其他人无法使用的日期,那么我正在尝试使用disabledDates但不能正常工作。

这是脚本

function DisableWed(date) {

    var day = date.getDay();
    // If day == 1 then it is Wednesday
    if (day == 3) {

    return [false] ; 

    } else { 

    return [true] ;
    }
  }
$('#pickdate').datetimepicker({
    format: 'Y-m-d H:s',
    beforeShowDay: DisableWed,
    minDate: 0,
    disabledDates: ['2016-11-03 09:00'],
    allowTimes: ['08:00','09:00','10:00','11:00','12:00','13:00','14:00','15:00','16:00','17:00']
});

正如所描述的http://xdsoft.net/jqplugins/datetimepicker/ minTime和disabledDates似乎不适合我。

1 个答案:

答案 0 :(得分:1)

你不需要在显示星期三前禁用星期三,如果你看一下这个文档,他们确实已经为你准备了disabledWeekDays。

disabledWeekDays: [3] // will disable Wednesday

然后使用onChangeDateTime检查用户点击的日期,以便您可以根据用户的选择重置允许的时间。

 onSelectDate:function(dp,$input){ // this will switch available time when choose the day
  if (dp.getDay() == 2) {
    this.setOptions({
      allowTimes: ['08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00']
    });
  } else {
    this.setOptions({
      allowTimes: ['08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00']
    });
  }

您还会在初始允许时间内执行if语句,以检查当天是否为星期二,星期二,初始允许时间为上午8点至下午2点,如果不是上午8点至下午6点

allowTimes: new Date().getDay() == 2 ? ['08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00'] : ['08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00'], // this we show 8am-2pm if today day is Tuesday

查看我的DEMO