resources Array
The configuration of the scheduler resource(s). A scheduler resource is optional metadata that can be associated with a scheduler event.
resources.dataColorField String
(default: "color")
The field of the resource data item which contains the resource color.
Example - set the resource data color field
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1 // the event is held in "Small meeting room" whose value is 1
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2 // the event is held in "Big meeting room" whose value is 2
}
],
resources: [
{
field: "roomId",
dataColorField: "key",
dataSource: [
{ text: "Small meeting room", value: 1, key: "#aabbcc" },
{ text: "Big meeting room", value: 2, key: "green" }
]
}
]
});
</script>
resources.dataSource Object|Array|kendo.data.DataSource
The data source which contains resource data items. Can be a JavaScript object which represents a valid data source configuration, a JavaScript array or an existing kendo.data.DataSource instance.
If the dataSource
option is set to a JavaScript object or array the widget will initialize a new kendo.data.DataSource instance using that value as data source configuration.
If the dataSource
option is an existing kendo.data.DataSource instance the widget will use that instance and will not initialize a new one.
Example - set the resource data source
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1 // the event is held in "Small meeting room" whose value is 1
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2 // the event is held in "Big meeting room" whose value is 2
}
],
resources: [
{
field: "roomId",
dataSource: [
{ text: "Small meeting room", value: 1 },
{ text: "Big meeting room", value: 2 }
]
}
]
});
</script>
resources.dataParentValueField String
(default: "parentValue")
The field of the resource data item which represents the parent resource item value where the current resource should be nested in. Used in hierarchical grouping scenarios where only part of the members of one resource should be grouped within a member of the previous (parent) resource.
Example - set the resource data parentValue field
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1,
attendees: [ 1, 2 ]
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2,
attendees: [ 3 ]
}
],
resources: [{
field: "roomId",
name: "Rooms",
dataSource: [
{ text: "Meeting Room 101", value: 1, color: "#6eb3fa" },
{ text: "Meeting Room 201", value: 2, color: "#f58a8a" }
],
title: "Room"
}, {
field: "attendees",
name: "Attendees",
dataParentValueField: "room",
dataSource: [
{ text: "Alex", value: 1, room: 1 },
{ text: "Bob", value: 2, room: 1 },
{ text: "Charlie", value: 3, room: 2 }
],
multiple: true,
title: "Attendees"
}],
group: {
resources: ["Rooms", "Attendees"],
orientation: "vertical"
}
});
</script>
resources.dataTextField String
(default: "text")
The field of the resource data item which represents the resource text.
Example - set the resource data text field
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1 // the event is held in "Small meeting room" whose value is 1
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2 // the event is held in "Big meeting room" whose value is 2
}
],
resources: [
{
field: "roomId",
dataTextField: "room",
dataSource: [
{ room: "Small meeting room", value: 1 },
{ room: "Big meeting room", value: 2 }
]
}
]
});
</script>
resources.dataValueField String
(default: "value")
The field of the resource data item which represents the resource value. The resource value is used to link a scheduler event with a resource.
Example - set the resource data value field
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1 // the event is held in "Small meeting room" whose roomId is 1
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2 // the event is held in "Big meeting room" whose roomId is 2
}
],
resources: [
{
field: "roomId",
dataValueField: "roomId",
dataSource: [
{ text: "Small meeting room", roomId: 1 },
{ text: "Big meeting room", roomId: 2 }
]
}
]
});
</script>
resources.field String
The field of the scheduler event which contains the resource id.
Example - specify the resource field
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1 // the event is held in "Small meeting room" whose value is 1
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2 // the event is held in "Big meeting room" whose value is 2
}
],
resources: [
{
field: "roomId",
dataSource: [
{ text: "Small meeting room", value: 1 },
{ text: "Big meeting room", value: 2 }
]
}
]
});
</script>
resources.multiple Boolean
(default: false)
If set to true
the scheduler event can be assigned multiple instances of the resource. The scheduler event field specified via the field option will contain an array of resources.
By default only one resource instance can be assigned to an event.
Example - multiple resources
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1,
atendees: [2, 3] // the resource instances with value 2 and 3 (Bob and Charlie)
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2,
atendees: [1, 2] // the resource instances with value 1 and 2 (Alex and Bob)
}
],
resources: [
{
field: "roomId",
dataSource: [
{ text: "Small meeting room", value: 1 },
{ text: "Big meeting room", value: 2 }
]
},
{
field: "atendees",
multiple: true,
dataSource: [
{ text: "Alex", value: 1 },
{ text: "Bob", value: 2 },
{ text: "Charlie", value: 3 }
]
}
]
});
</script>
resources.name String
The name of the resource used to distinguish resource. If not set the value of the field option is used.
Example - set the resource title
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1 // the event is held in "Small meeting room" whose value is 1
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2 // the event is held in "Big meeting room" whose value is 2
}
],
resources: [
{
field: "roomId",
title: "Room",
name: "Room",
dataSource: [
{ text: "Small meeting room", value: 1 },
{ text: "Big meeting room", value: 2 }
]
}
]
});
</script>
resources.title String
The user friendly title of the resource displayed in the scheduler edit form. If not set the value of the field option is used.
Example - set the resource title
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1 // the event is held in "Small meeting room" whose value is 1
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2 // the event is held in "Big meeting room" whose value is 2
}
],
resources: [
{
field: "roomId",
title: "Room",
dataSource: [
{ text: "Small meeting room", value: 1 },
{ text: "Big meeting room", value: 2 }
]
}
]
});
</script>
resources.valuePrimitive Boolean
(default: true)
Set to false
if the scheduler event field specified via the field option contains a resource data item.
By default the scheduler expects that field to contain a primitive value (string, number) which corresponds to the "value" of the resource (specified via dataValueField
).
Example - set valuePrimitive to false
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
room: { value: 1 } // the resource field is an object instead of a primitive value
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
room: { value: 2 } // the resource field is an object instead of a primitive value
}
],
resources: [
{
field: "room",
valuePrimitive: false,
dataSource: [
{ text: "Small meeting room", value: 1 },
{ text: "Big meeting room", value: 2 }
]
}
]
});
</script>