Customize the row border color for time slot and odd-even background color for the week and day view

Scheduler Javascript
#1

Customize the row border color for time slot and odd-even background color for the week and day view

Hello Team,
I am looking to customize the timeslot row border and background color for day and week view.
i am able to do in the month view, but not in week and day view.
find the attached image for reference

49%20AM
49%20AM2904Γ—564 13.5 KB

#2

Hello @rakeshkumar.jha ,

The built-in way to change background for specific rows/time slots, is to use the Blocking and Marking Dates functionality:
https://docs.dhtmlx.com/scheduler/limits.html

That allows to colorize specific time slots(for example odd/even hours), the code may look like follows:

var oddEvenSlotsArray = [
  0*60, 1*60, 2*60, 3*60,  4*60, 5*60,  6*60, 7*60,  8*60, 9*60,  10*60, 11*60,
  12*60, 13*60, 14*60, 15*60,  16*60, 17*60,  18*60, 19*60,  20*60, 21*60,  22*60, 23*60,
]

var config ={
    days:  [0,1,2,3,4,5,6], 
    zones: oddEvenSlotsArray, 
    css: "cssClassName", 
}

scheduler.init("scheduler_here",new Date(2020,5,30),"week");

scheduler.addMarkedTimespan(config);
scheduler.render();

Here is a demo:
http://snippet.dhtmlx.com/5/60fd4cbe5

The addMarkedTimespan config API:
https://docs.dhtmlx.com/scheduler/api__scheduler_addmarkedtimespan.html

#3

Thanks for the quick workaround Siarhei

1 Like