Change the color of the event

Asked by prabhat
8 years ago.

Hi Dan,

I am giving colours to the events based on resource name.Now i want to change the colour of the event when selected.

function selectEvents(events) {
for (var i = 0; i < events.length; i++) {
var evt = events[i];
evt.backColor = 'Gray';
me.dp.multiselect.add(evt, true);
};

me.dp.update();

me.dp.multiselect.redraw();
};

but the colour is not changing.i am working on scheduler and javascript.
And one more problem is not able to add events to multi select if the events are in different resources.

For selection i am using resource context menu.

Thanks

javascript

Answer posted by Dan Letecky [DayPilot]
8 years ago.

If "events" holds an array of DayPilot.Event objects you need to change the background color like this:

// ...
evt.data.backColor = 'Gray'; 
// ...

instead of

// ...
evt.backColor = 'Gray'; 
// ...

Also, when you select an event the Scheduler automatically applies "scheduler_default_selected" CSS class to the event box (for the default theme which is "scheduler_default"). Depending on your scenario, you may simply adjust the CSS to apply a custom background color.

The default CSS looks like this:

.scheduler_default_selected .scheduler_default_event_inner {
  background: #ddd;
}

It's necessary to use the full selector (including the *_event_inner part) and also "background" style instead of "background-color" in order to override the default event color.

This question is more than 1 month old and has been closed. Please create a new question if you have anything to add.