Template, event_class

Scheduler Javascript
#1

Hello,

I want to change background color of my events:

I have this code:

scheduler.templates.event_class = GetEventCSSClass;

function GetEventCSSClass(start, end, event)
{
if (start < (new Date())) //if date is in past
return “past_reservation”; //then set special css class for it
else {
var mid = parseInt(jQuery.url.param(“mid”));
if (parseInt(event.member_id) == mid)
return “my_reservation”;
else
return “other_reservation”;
}
}
Css classes are in my aspx page’s header and external css file (both already).
Still it doesn’t work. All events are displayed in yellow background as always.
If I run Chrome’s debugger and set a BP on GetEventCSSClass() - it stops there.
So what do I do wrong ?

Thank you,

Vlad

#2

Hi,

  1. Please make sure that classes are applied to the events (you can check event boxes with browser Inspector)
  2. Which skin do you use?
  3. Please show CSS definitions of your classes, so we could check them

note that most of scheduler skins attaches color not to ‘dhx_cal_event’ element, but to it’s nested elements. So probably you’ll need to define your classes in following way:

.dhx_cal_event.past_reservation div{ background-color:color: }
docs.dhtmlx.com/scheduler/custom … stoanevent

#3

Classes were set:

....

I renamed my classes from
.my_reservation {…}
to
.dhx_cal_event.my_reservation div
{
background-color: yellow;
}
.dhx_cal_event.other_reservation div
{
background-color: lightblue;
}
…

Now it started to color events differently.

Thank you again :slight_smile: