Kendo UI Scheduler: customizing rooms header - kendo-ui

Question

I'm using the Kendo UI Scheduler (open source) with the horizontal grouping, developing in ASP.NET MVC. I display different rooms in order that users can make bookings to one of these. But instead of the room name I also want to display some icons according to the equipment available in this room (ex: a beamer).
Here you can see an example of what I have now and what I want to have:
So my question: is it possible to include these icons in the header of my scheduler and how? + after clicking these the user should be redirected to the detail page of this room.
Thanks in advance!

Answer 1

I believe (from your image) that you need to make a Custom View and replace the "Day" view with the Custom View. That should allow you some flexibility.
Since you are using the HTML5/JavaScript version of Kendo UI, here's an example project of developing a custom view: http://www.telerik.com/support/code-library/custom-view For those seeing this post that need the ASP.NET MVC version of the Custom View example, that is located here: http://www.telerik.com/support/code-library/custom-view-0286055de51d

Answer 2

We can achieve this by custom headers.
Use dateHeaderTemplate property of Kendo Scheduler.
Read about this here: link
Basics of dateHeaderTemplate
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
dateHeaderTemplate: kendo.template("<strong>#=kendo.toString(date, 'd')#</strong>"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview"
}]});
</script>
Please refer below 2 posts to customize the header.
post 1
post 2
Rendering can be done in dataBound event
dataBound: SchedulerView.Scheduler_DataBound,
Method
Scheduler_DataBound: function () {
//write logic here to
}