CODEWITHSUNDEEP
colorskendo-uicustomizationrowskendo-scheduler
Joan Gerard
Joan Gerard

Reputation: 125

How to customize rows or columns color in Kendo.Scheduler?

Is there a way to customize kendo.Scheduler rows and columns color? If there is, let me know how! How to change these rows color?

UPDATE 1> This is the answer>

     view.table.find("td[role='gridcell']").each(function () {
        if ($(this) != null) {
            var element = $(this);
            if (element != null) {
                var slot = scheduler.slotByElement(element);
                if (slot != null) {
                    var dateSlot = slot.startDate;
                    if ("20/09/2014 14:00"== dateSlot.toString())
                        element.addClass("red");
                }
            }
        }
    });

You have to add the following css too:

.k-scheduler .k-today.red { 
        background: #ff6f7b; /*When the slot is today*/
    }
.red {
        background: #ff6f7b;
    }
.k-scheduler .k-state-selected.red { /*The color when you select the slot*/
        background: #4070B8;
    }

Upvotes: 3

Views: 3507

Answers (1)

ChrG
ChrG

Reputation: 141

function scheduler_dataBound(e) {
      var scheduler = $("#scheduler").data("kendoScheduler"); 
      var view = scheduler.view();
      view.table.find("td[role=gridcell]").each(function () {
      if ($(this) != null) {
         var element = $(this);
         if (element != null) {
              var slot = scheduler.slotByElement(element);
                 if (slot != null)
                     if (slot.startDate, slot.endDate, == "youre times")
                         element.addClass("youre css clas name ");
         }
     }
});

Upvotes: 5

Related Questions