javascript - Kendo UI Scheduler - 如何刷新/显示隐藏/过滤资源列表

Question

我有一个 Kendo UI 调度程序，配置为时间线(左侧垂直的单个资源列表，顶部水平的小时 block )。我能够使用正确的资源初始化调度程序，但渲染后我想修改列表(隐藏其中一些)，但无法获取资源列表来刷新其自身。

我已尝试了以下所有组合，但没有一个成功刷新列表。

var sched = $("#TimeLineView").data("kendoScheduler");
sched.resources[0].dataSource.read();
sched.resources[0].dataSource.sync();
sched.refresh();
sched.view(sched.view().name);

初始创建

$("#TimeLineView").kendoScheduler({
    date: new Date(),
    timezone: null,
    views: [
        {
            type: "timeline",
            majorTick: 60,
            minorTickCount: 1
        }
    ],
    currentTimeMarker: {
        updateInterval: 120000
    },
    group: {
        resources: ["Users"],
        orientation: "vertical"
    },
    resources: [
        {
            field: "UserId",
            name: "Users",
            dataSource: [
                { value: "Bob" },
                { value: "Rob" }
            ],
            multiple: true,
            title: "Users"
        }
    ],
    height: 500
});

Answer 1

这是DEMO用于过滤(显示/隐藏)调度程序资源。

下面是 DEMO 中过滤资源的代码片段:

HTML:

<input type="button" value="Only show Alex and Rob" id="btn" />
<input type="button" value="Show Everyone" id="showAll" />

JS:

$('#showAll').click(function() {
  var showOnly = [];//pass an empty array to show all the resources
  filterSchedulerResources(showOnly);
});

$("#btn").click(function() {
  var showOnly = ['Alex', 'Rob'];
  filterSchedulerResources(showOnly);

});

function filterSchedulerResources(showOnly)
{
  console.log('showOnly = ',showOnly);

  var filter = {
    logic: "or",
    filters: $.map(showOnly, function(value) {
      return {
        operator: "eq",
        field: "value",
        value: value
      };
    })
  };

  var scheduler = $("#scheduler").data("kendoScheduler");  
  //filter the resource data source 
  scheduler.resources[0].dataSource.filter(filter);  

  scheduler.view(scheduler.view().name); //refresh the currunt view  
}