javascript - 如何向 KendoUI Scheduler 动态添加和删除 GROUPS

标签 javascript jquery kendo-ui kendo-scheduler

我正在使用 KendoUI Scheduler 控件,这里是初始化代码

                  $("#Scheduler").kendoScheduler({

                       dataSource: [],
                       selectable: true,
                       height: 500,
                       editable: false,
                       eventTemplate: $("#event-template").html(),
                       views: [
                               "day",
                               { type: "week", selected: true },
                               "month",
                               "agenda"
                       ],
                       resources: [
                             {
                                 field: "resourceviewid",
                                 name: "ResourceViews",
                                 dataColorField: "key",
                                 dataSource: [
                                     { text: "Appointments", value: 1, key: "orange" },
                                     { text: "Delivery Specialist", value: 2, key: "blue" },
                                     { text: "Orientation Specialist", value: 3, key: "green" }
                                 ]
                             }
                       ],
                       group: {
                           resources: ["ResourceViews"],
                           orientation: "horizontal"
                       }
                   });

这里的“约会”组是默认的,它将始终可用

我的屏幕上有复选框

        <div id="divResourceView">
            <label><input checked type="checkbox" value="1" />Delivery Specialist</label>
            <label><input checked type="checkbox" value="2" />Orientation Specialist</label>
        </div>

在更改事件时,我编写了以下代码,以从复选框中获取选定的值并更新 KendoUI 调度程序的GROUP数据源,如下所示

        $("#divResourceView :checkbox").change(function (e) {
        var checked = $.map($("#divResourceView :checked"), function (checkbox) {
            return parseInt($(checkbox).val());
           });
        });

        var scheduler = $("#Scheduler").data("kendoScheduler");

        var arrayOfStrings = checked.toString().split(",");

        for (var i = 0; i < arrayOfStrings.length; i++)
        {
            if(arrayOfStrings[i] == 1)
            {
                var data = [{ text: "Delivery Specialist", value: 2, color: "blue" }];
                scheduler.resources[1].dataSource.data(data);
            }
            if (arrayOfStrings[i] == 2) {
                var data = [{ text: "Orientation Specialist", value: 3, color: "green" }];
                scheduler.resources[2].dataSource.data(data);
            }
        }

        scheduler.refresh();

但它会删除所有组并仅添加一个。当 arrayOfStrings 的值为“1,2”时,我想看到这两个组,

我可以在初始化期间看到所有组,但当我选中复选框时它就会消失。

供引用的图片 初始化期间 enter image description here

之后 enter image description here

如您所见,调度程序控制中缺少 Delivery Specialist

找到一些链接:http://www.telerik.com/forums/add-filter-to-resource-datasource 但不确定他们在谈论什么?似乎是刷新问题。

最佳答案

我已经这样做了,我相信你是对的,你的问题与刷新有关,我使用以下内容来刷新它。

var scheduler = $("#scheduler").data("kendoScheduler");
scheduler.view(scheduler.view().name);

希望这能帮助解决这个问题,太晚了(我目前正在寻找如何懒惰地做到这一点

关于javascript - 如何向 KendoUI Scheduler 动态添加和删除 GROUPS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26116120/

相关文章:

javascript - Kendo Grid 自定义命令按钮动态显示

javascript - Materializecss 选择双击切换

javascript - jQuery Joyride 和 AngularJS 实现

javascript - 如何在链接单击时将图像加载到 Canvas 中

javascript - 正则表达式检测数字但不检测小数

javascript - Kendo UI - 如何使用 javascript 添加和选择新选项卡(在 TabStrip 控件上)

javascript - 带标签的 Kendo 图表模板,内部显示 html 标签

javascript - Websocket base64,二进制类型

javascript - 如何从其他地方访问项目的 babel 相关 deps?

javascript - CORS 调用可以在 PHP 中工作,但不能在 javascript/jquery 中工作