jQuery datetimepicker:禁用时间

use*_*109 7 jquery-ui datepicker datetimepicker jquery-ui-datepicker

jQuery datetimepicker在我的应用程序中使用XDSoft (Ruby on Rails 4(仅供参考,不使用bootstrap datetimepicker)).

我想知道是否有办法在特定日期禁用/停用特定时间,例如2014年12月17日仅停用17:00? disabledDates: ['...']禁用特定日期.

我尝试过disabledDateTimes,disabledTimes但他们不工作.谢谢.

Tre*_*vor 10

以下是使用您询问的XDSoft DateTimePicker如何完成此操作的一个示例.

我有一个specificDates数组,您可以使用它来添加您想要定位的日期.

我还有一个hoursToTakeAway多维数组,它与数组相对应specificDates,您可以在其中指定要带走的小时数.

HTML

<input class="eventStartDate newEventStart eventEditDate startTime eventEditMetaEntry" id="from_date" name="from_date" placeholder="Start date and time" readonly="readonly" type="text" />
Run Code Online (Sandbox Code Playgroud)

使用Javascript

var specificDates = ['24/12/2014','17/12/2014'];

var hoursToTakeAway = [[14,15],[17]];

$('#from_date').datetimepicker({
    format:'d.m.Y H:i',
    timepicker: true,
    lang: 'en',
    onGenerate:function(ct,$i){
      var ind = specificDates.indexOf(ct.dateFormat('d/m/Y'));
      $('.xdsoft_time_variant .xdsoft_time').show();
      if(ind !== -1) {
          $('.xdsoft_time_variant .xdsoft_time').each(function(index){
              if(hoursToTakeAway[ind].indexOf(parseInt($(this).text())) !== -1)              {
                  $(this).hide();        
              }
          });
      }
    }
});
Run Code Online (Sandbox Code Playgroud)

示例 小提琴

基本上我正在利用onGenerate每个日历渲染后发生的事件.然后我检查日期是否与指定日期匹配,如果是,我们遍历所有时间元素并隐藏为特定日期指定的日期.

更新了小提琴实现禁用.

小提琴2