关于Kendo Scheduler小部件,我使用MVC Razor Helper,但我需要用户能够定义他们自己的"资源"在元数据中,然后让调度程序基于此配置进行渲染。
我见过的所有示例都要求开发人员在设计时知道要绑定的资源(例如RoomID,OwnerID,Attendeed),使用以下添加资源的方式....
.Resources(resource =>
{
resource.Add(m => m.RoomID)
.Title("Room")
.DataTextField("Text")
.DataValueField("Value")
.DataColorField("Color")
.BindTo(new[] {
new { Text = "Meeting Room 101", Value = 1, Color = "#6eb3fa" },
new { Text = "Meeting Room 201", Value = 2, Color = "#f58a8a" }
});
resource.Add(m => m.Attendees)
.Title("Attendees")
.Multiple(true)
.DataTextField("Text")
.DataValueField("Value")
.DataColorField("Color")
.BindTo(new[] {
new { Text = "Alex", Value = 1, Color = "#f8a398" } ,
new { Text = "Bob", Value = 2, Color = "#51a0ed" } ,
new { Text = "Charlie", Value = 3, Color = "#56ca85" }
});
})
但是,在设计时,我不知道资源是什么(例如RoomID,Attendees)。我只知道一旦应用程序运行并查询元数据/数据库。 即我希望能够通过优选地进行Ajax调用来构建资源,或者可能通过循环存储在ViewBag变量中的集合来构建资源。 如下所示:
.Resources(resource =>
{
foreach(ResourceType resourceType in ViewBag.ResourceTypes)
{
resource.Add(resourceType.Name)
.Title(resourceType.Name)
.DataTextField("Text")
.DataValueField("Value")
.DataColorField("Color")
.BindTo(new[] {
new { Text = "some text", Value = 1, Color = "#6eb3fa" },
new { Text = "some other text", Value = 2, Color = "#f58a8a" }
});
}
})
请告诉我这是否有意义,或者我是否需要提供更多信息......
由于
乔恩
答案 0 :(得分:0)
$("#people :checkbox").change(function (e) {
var scheduler = $("#scheduler").data("kendoScheduler");
var checkbobxObj = $(this);
var resourceData = scheduler.resources[0].dataSource.data();
var reourceMatched = jQuery.grep(resourceData, function (n, i) {
return (n.ResourceId == checkbobxObj.val());
});
if (reourceMatched.length == 0) {
scheduler.dataSource.options.serverFiltering = false;
scheduler.resources[0].dataSource.add({
ResourceId: checkbobxObj.val(),
ResourceName: checkbobxObj.prop("name")
});
// filter resource
filterResource();
}
else {
// filter resource
filterResource();
}
});
filterResource = function () {
var scheduler = $("#scheduler").data("kendoScheduler");
var checked = $.map($("#people :checked"), function (checkbox) {
return parseInt($(checkbox).val());
});
var filter = {
logic: "or",
filters: $.map(checked, function (value) {
return {
operator: "eq",
field: "ResourceId",
value: value
};
})
};
//filter the resource data source
scheduler.dataSource.options.serverFiltering = false;
console.log("filter", filter);
scheduler.resources[0].dataSource.filter(filter);
scheduler.view(scheduler.view().name);
scheduler.dataSource.options.serverFiltering = true;
};