New to Kendo UI for jQuery? Download free 30-day trial

Pass custom data to Scheduler Resources to be consumed in HeaderTemplate


Product Version 2018.2.620
Product Progress® Kendo UI® Scheduler for jQuery


By default, the resource object includes a specific set of fields (title, value, color, etc.). My resources dataSource returns those fields, but also includes other customer fields (a, b, x, y, z for example). Is there a way to use these values in the groupHeaderTemplate?


<script id="groupHeaderTemplate" type="text/x-kendo-template">
    <div class="container">
        <div id="customField-timezone-#=value#">a</div>
        <div id="customField-message-#=value#">b</div>
        <div id="customField-status-#=value#">x</div>
  • Initialize a Kendo Scheduler and when specifying the groupHeaderTemplate pass a custom function that would iterate the widget's dataSource, pass the custom values to the template and return the template:
<div id="scheduler"></div>
        groupHeaderTemplate: function (item) {
            var scheduler = $("#scheduler").data("kendoScheduler");
            var resourceData = scheduler.resources[0];
            for (var i = 0; i < resourceData.length; i++) {
                if (resourceData[i].value == item.value) {
                    item.timezoneOffset = resourceData[i].timezoneOffset > 0 ? "+" + resourceData[i].timezoneOffset : resourceData[i].timezoneOffset;
                    item.message = resourceData[i].message;
                    item.status = resourceData[i].status;

            var template = kendo.template($("#groupHeaderTemplate").html());
            return template(item);

See Also

In this article