如何将假期添加到 kendo 调度程序？

Question

有人知道如何将假期添加到 kendo 调度程序吗？

我的意思是在节假日用户不应该添加任何事件。

Answer 1

可以通过 messages.allDay 设置消息，如下所示：

<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
  date: new Date("2013/6/6"),
  messages: {
    allDay: "Holiday"
  },
  dataSource: [
    {
      id: 1,
      start: new Date("2013/6/6 08:00 AM"),
      end: new Date("2013/6/6 09:00 AM"),
      title: "Interview"
    }
  ]
});
</script>

您可以查看 this executable example 假期详情。

编辑

BorHunter: but in your example I can add new events into scheduler, but I don't need it. I mean user shoudn't be able to add event on that particular holiday/date.

然后您只需使用 editable like this example 禁用该选项即可：

editable: false,

或this one:

editable: {
  create: false,
  update: false,
  resize: false,
  move: false,
  destroy: false
},

Answer 2

我建议在我创建的示例中添加自定义 class class k-holiday 或者可能利用 kendo class k-non-workhour 并在 dataBound 函数上添加：

dataBound: function () {
    var scheduler = this;
    //get scheduler view
    var schedulerView = this.view();
    //loop through all slot/event/tile
    schedulerView.table.find("td[role=gridcell]").each(function () {

        //find start date
        var slot = scheduler.slotByElement($(this));

        var CONSTANT_HOLIDAY_DATE = new Date("2013/6/11");
        CONSTANT_HOLIDAY_DATE.setHours(0, 0, 0, 0);
        slot.startDate.setHours(0, 0, 0, 0);

        //compare date curent event with holiday
        if (slot.startDate.getTime() == CONSTANT_HOLIDAY_DATE.getTime()) {
            $(this).addClass("k-holiday");
        } else {
            $(this).removeClass("k-holiday");

        }
    });
},

我在这个特定的日期 new Date("2013/6/11") 创建了一个假期，稍后在这个日期的所有 event/slot 都会有 k-holiday class , 然后你想把这个添加到你的编辑功能中:

edit: function (e) {
    var uid = e.container.attr('data-uid');
          var element = e.sender.element.find('div.k-event[data-uid="' + uid + '"]');
    var slot =$("#scheduler").data("kendoScheduler").slotByElement(element);
    if($(slot.element).hasClass("k-holiday")){
        e.preventDefault();
    }
}

以上条件将过滤双击/编辑的事件，它会阻止有 k-holiday 的事件打开弹出窗口。请参考这个kendo dojo

注意：在该示例中，您会注意到在 2011 年 6 月 星期二 您无法触发 edit/add 新事件，但在除此之外的那一天你仍然可以

如何将假期添加到 kendo 调度程序？

How to add holidays to kendo scheduler?

kendo-ui

kendo-scheduler

编辑