jQuery调度器概述剑道UI

调度器显示一组事件、约会或任务。

它支持在不同的视图中显示计划好的事件——单个天、整个星期或几个月,或者作为需要完成的任务列表。

从R1 2017发行版开始,当用户编辑一个系列时,异常不再被自动删除。对特定事件所做的更改将在系列编辑期间持久化。如果序列包含异常,调度器将呈现异常重置系列按钮。编辑系列的对话框,允许用户通过删除现有异常来重置系列。

截至剑道UI 2016 Q2(2016.2.504)发布:

jQuery Kendoka图像的剑道UI

调度器是jQuery的剑道UI,一个具有 110+ 组件的专业级UI库,用于构建现代和功能丰富的 应用程序。想要试用它,可以注册一个30天的免费试用期。

  • 调度程序替换分号()作为带有逗号的递归异常的分隔符类型().
  • 调度器不再向递归异常添加尾随分隔符。

这一变化是由RFC 5545规范。注意,前面演示的行为是不正确的。

初始化调度器

  1. 包括Kendo UI JavaScript和CSS文件。有关更多信息,请参阅关于开始使用剑道UI的文章
  2. 要进行初始化,调度器需要将其绑定到kendo.data.SchedulerDataSource特殊类型的剑道UI数据源。SchedulerDataSource包含自定义的实例kendo.data.SchedulerEventKendo UI模型,表示调度器的事件数据项。

属性的所有字段,以启用对循环事件的编辑和使用kendo.data.SchedulerEventschema.model数据源的。

基本配置

kendo.data.SchedulerEvent对象提供以下字段:

  • 描述字符串- Scheduler事件的文本描述。
  • 结束日期-事件结束的日期。
  • 身份证号码- Scheduler事件的唯一标识符。事件的id未设置的被认为是新的。
  • isAllDay布尔-表示该事件是否全天。
  • recurrenceException字符串-递归异常。
  • recurrenceId字符串| |对象数量——id递归父项的。如果设置,当前事件是一个递归异常。
  • recurrenceRule字符串-描述事件重复模式的递归规则。遵循rfc5545规范。
  • 开始日期-活动开始的日期。
  • 标题字符串-在Scheduler视图中显示的事件标题。

当你使用schema.model.fields,列出所有kendo.data.SchedulerEvent字段。属性的字段id的事件通过schema.model.id

如果远程服务以不同的格式存储和返回调度器任务,请使用schema.model.fields而且schema.model.id用于描述它们的数据源选项。

下面的示例演示如何将远程服务字段映射到客户端调度器事件字段。

schema: {model: {id: "taskId", //(必选)事件的id为"taskId"字段。{//描述Scheduler事件字段并将它们映射到远程服务返回的字段。taskId: {from: " taskId ", // 'taskId'服务器端字段被映射到'taskId'客户端字段。type: "number"}, title: {from: " title ", // 'title'服务器端字段映射到'title'客户端字段。defaultValue: "No title", validation: {required: true}}, start: {type: "date", from: " start " // 'start'服务器端字段被映射到'start'客户端字段。}, end: {type: "date", from: " end " // 'end'服务器端字段被映射到'end'客户端字段。},描述:{from:“描述”},递归id: {from:“递归id”},递归规则:{from:“递归规则”},递归异常:{from:“递归异常”},isAllDay: {type:“boolean”,from:“isAllDay”}}}}

功能和特性

方法、字段和事件

调度程序公开一组方法而且字段您可以用来配置小部件。

< div id = "调度器" > < / div > <脚本> $(" #调度器")。kendoScheduler({ date: new Date("2013/6/6"), dataSource: [ { id: 1, start: new Date("2013/6/6 08:00 AM"), end: new Date("2013/6/6 09:00 AM"), title: "Breakfast" } ] }); // Get a reference to the kendo.ui.Scheduler instance. var scheduler = $("#scheduler").data("kendoScheduler"); scheduler.view("week"); // Go to the Week view. 

调度器还支持一组事件你可以订阅。要处理事件,可以指定将在小部件初始化期间处理事件的JavaScript函数,或者使用绑定小部件初始化后的方法。

事件处理程序是在触发事件时调用的JavaScript函数。事件处理程序的参数是一个JavaScript对象,其中包含特定于事件的数据。方法获取对触发事件的小部件的引用发送方事件参数的字段。事件处理程序的函数上下文,该处理程序可通过关键字设置为触发事件的小部件的实例。

下面的示例演示如何在小部件初始化期间订阅Scheduler事件。

< div id = "调度器" > < / div > <脚本> $(" #调度器")。kendoScheduler({ date: new Date("2013/6/6"), dataSource: [ { id: 1, start: new Date("2013/6/6 08:00 AM"), end: new Date("2013/6/6 09:00 AM"), title: "Breakfast" } ], edit: function(e) { console.log("edit"); } }); 

属性订阅调度器事件绑定方法。

引用现有实例

若要引用现有调度器实例,请使用jQuery.data ()然后通过kendoScheduler作为一个论证。建立了引用之后,使用调度程序API控制它的行为。

< div id = "调度器" > < / div > <脚本> $(" #调度器")。kendoScheduler({ date: new Date("2013/6/6"), dataSource: [ { id: 1, start: new Date("2013/6/6 08:00 AM"), end: new Date("2013/6/6 09:00 AM"), title: "Breakfast" } ] }); // Get a reference to the kendo.ui.Scheduler instance. var scheduler = $("#scheduler").data("kendoScheduler"); 

另请参阅

在本文中
Baidu
map