Question

我有一个配置为时间轴的Kendo UI调度程序（左侧垂直的单个资源列表，以及沿顶部水平的小时块）。我能够使用正确的资源初始化调度程序，但在渲染之后我想修改列表（隐藏其中一些），但是无法获取资源列表来刷新它自己。

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

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  
}

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

1 个答案: