尝试在kendo schedule的自定义视图中连接多选，但它没有显示数据源数据。来自服务器和数据的数据存储在资源中。其他字段显示确定。有人可以帮我这个吗？
数据来源
$scope.attendeesDS = new kendo.data.DataSource({
type: "odata",
transport: {
read:
{
url: "odata/AttendeesOData",
dataType: "json"
}
},
schema: {
data: function(data) {
return data["value"];
},
total: function(data) {
return data["odata.count"];
},
model: {
fields: {
value: { from: "Id", type: "number" },
text: { from: "text", type: "string" },
color: { from: "color", type: "string" }
}
}
},
serverPaging: true,
serverSorting: true,
serverFiltering: true,
pageSize: 15
});
计划程序初始化
$("#ksheduler").kendoScheduler({
date: new Date(),
startTime: new Date("2015/1/1 07:00 AM"),
dateHeaderTemplate: kendo.template("<strong>#=kendo.toString(date, 'd/M')#</strong>"),
height: 600,
views: [
"day",
{ type: "workWeek", selected: true },
"week",
"month",
"agenda",
{ type: "timeline", eventHeight: 50 }
],
timezone: "Etc/UTC",
editable: {
template: kendo.template($("#schedulerTemplate").html())
},
dataSource: {
type: "odata-v4",
batch: false,
sync: function (e) {
var scheduler = $("#ksheduler").data("kendoScheduler");
if (scheduler) {
scheduler.refresh();
scheduler.dataSource.read();
}
},
transport: {
//cache: false,
read: {
url: "odata/ScheduleOData",
dataType: "json",
contentType: "application/json; charset=utf-8",
},
update: {
url: "odata/ScheduleOData",
type: "Post",
dataType: "json",
contentType: "application/json; charset=utf-8",
data: function (response) {
if (response.Attendees == null) {
response.Attendees = [];
}
if (response.Clients == null) {
response.Clients = [];
}
if (response.Tutees == null) {
response.Tutees = [];
}
if (response.Placements == null) {
response.Placements = [];
}
return response;
},
},
create: {
url: "odata/ScheduleOData",
type: "Post",
dataType: "json",
contentType: "application/json; charset=utf-8",
data: function (response) {
if (response.Attendees == null) {
response.Attendees = [];
}
if (response.Clients == null) {
response.Clients = [];
}
if (response.Tutees == null) {
response.Tutees = [];
}
if (response.Placements == null) {
response.Placements = [];
}
return response;
},
},
destroy: {
url: function (data) {
return "odata/ScheduleOData(" + data.Id + ")";
},
type: "Delete",
dataType: "json",
contentType: "application/json; charset=utf-8",
},
parameterMap: function (data, operation) {
if (operation == "destroy") {
return;// kendo.stringify(data);
}
var d = kendo.data.transports.odata.parameterMap(data, operation);
delete d.$inlinecount; // <-- remove inlinecount parameter
delete d.$callback;
return d;
}
},
schema: {
data: function (data) {
return data["value"];
},
total: function (data) {
return data['@odata.count'];
},
model: {
id: "taskId",
fields: {
taskId: { from: "Id", type: "number" },
title: { from: "Title", defaultValue: "Interview", validation: { required: true } },
start: { type: "date", from: "StartDate" },
end: { type: "date", from: "EndDate" },
startTimezone: { from: "StartTimezone" },
endTimezone: { from: "EndTimezone" },
description: { from: "Description" },
recurrenceId: { from: "RecurrenceID", defaultValue: 0 },
recurrenceRule: { from: "RecurrenceRule" },
recurrenceException: { from: "RecurrenceException" },
isAllDay: { type: "boolean", from: "IsAllDay" },
isInterview: { type: "boolean", from: "IsInterview", title: "Interview", defaultValue: true },
isSession: { type: "boolean", from: "IsSession", title: "Session" },
attendees: { from: "Attendees", nullable: true },
clients: { from: "Clients", nullable: true },
tutees: { from: "Tutees", nullable: true },
placements: { from: "Placements", nullable: true },
ownerId: { from: "OwnerID", defaultValue: 0 },
location: { from: "Location" },
notes: { from: "Notes" },
}
}
},
},
resources: [
{
field: "attendees",
dataSource: $scope.attendeesDS,
multiple: true,
dataTextField: "text",
dataValueField: "id",
title: "Tutors",
nullable: true
}
]
});
在自定义模板中多重选择
<div class="k-edit-label">
<label for="Attendees">Tutors</label>
</div>
<div data-container-for="Attendees" class="k-edit-field">
<select id="Attendees" multiple="multiple" name="Attendees"
data-role="multiselect"
data-bind="value: attendees"
data-source="attendees"
data-text-field="text"
data-value-field="id"
data-value-primitive="true"></select>
</div>
答案 0 :(得分：1)
首先你选择数据源的方式，嗯我不认为它是正确的，改为使用这种方式：
您需要添加编辑事件，您可以在其中将数据源添加到调度程序上的可编辑模板。
edit: function(e) {
debugger;
var ownerId = e.container.find("#ownerId").data("kendoDropDownList");
var attendeesId = e.container.find("#attendeesId").data("kendoMultiSelect");
//bind the widget to the resouces
ownerId.dataSource.data(e.sender.resources[0].dataSource.data());
attendeesId.dataSource.data(e.sender.resources[1].dataSource.data());
}
我修改了调度程序的kendo dojo示例，当您编辑调度程序的事件时，它将使用自定义可编辑模板并添加多选
我还修改了kendo示例并将multiselect添加到其自定义模板
<div data-container-for="attendeesId" class="k-edit-field">
<select id="attendeesId" data-bind="value:attendeesId" data-role="multiselect" data-value-field="id" data-text-field="name"/>
</div>
修改资源数据
resources: [
{
field: "ownerId",
title: "Owner",
dataSource: [
{ text: "Alex", value: 1, color: "#f8a398" },
{ text: "Bob", value: 2, color: "#51a0ed" },
{ text: "Charlie", value: 3, color: "#56ca85" }
]
},{
field: "attendeesId",
title: "Attendees",
dataSource:[
{name:"Brown",id:"1"},
{name:"Daniel",id:"2"},
{name:"John",id:"3"},
{name:"Hawk",id:"4"},
{name:"Borne",id:"6"},
{name:"Deryl",id:"7"},
{name:"Jack",id:"8"}
]
}
],
编辑：关于你的评论＆＃34;我在你的例子中没有看到定义的参与者在模型和模型中的位置我如何才能获得已经选定的与会者。＆＃34;
假设您要存储multiselect哪个数据类型是对象数组，
我已经读过，根据kendo forum，当前kendo模型无法处理像对象或数组这样的复杂数据类型，所以此处的变通方法引用了这个link。您可以将它存储在单独的kendo observable上，并将可观察对象绑定到您添加此kendo.bind(e.container.find("#attendeesId"), viewModel);的编辑功能上的多选。还要看一下参数map，我在其中检索selectedAttendees然后将其添加到option.model然后继续保存/更新到服务器的过程
if (operation !== "read" && options.models) {
if(typeof options.models !== "undefined"){
options.models[0].selectedAttendees = viewModel.selectedAttendees;
console.log("the models here :",options.models);
}
return {models: kendo.stringify(options.models)};
}
我也在这个新的kendo dojo上修改了我的示例，您可以看到options.models的控制台日志现在已经选择了参与者属性。