Skip to content
DayPilot

Change the backColor based upon event value

Asked by Jeff Kurzner
6 years ago.

Looked and couldn't quite figure out the best way to handle this. I would like to utilize an event parameter to back color those events that don't match the criteria. For example, assume a professor is looking at events for a specific room and wants to see all items scheduled there. He would prefer to see all of his items colored in white with other teacher's event's styled in gray to differentiate them. I was thinking that I could add a paramater to the event object such as "isProf":"true" or "isProf":"false" and then apply some kind of styling? Is there a good way to accomplish it?

how-tojavascript
Answer posted by Dan Letecky [DayPilot]
6 years ago.

Yes, you can do that using onBeforeEventRender event handler. Please take a look at the examples in the docs (the following link is for the Scheduler):

https://doc.daypilot.org/scheduler/event-customization/

Especially the "Accessing Event Data" section: 

dp.events.list = [
  {
    start: "2016-03-15T00:00:00",
    end: "2016-03-17T00:00:00",
    id: "1",
    text: "Event 1",
    tags: { detail: "Detailed event description", type: "important" }  
  }
];

dp.onBeforeEventRender = function(args) {
  args.data.cssClass = "test";
  args.data.html = args.data.text + "<br/>" + args.data.tags.detail;
  if (args.data.tags.type === "important") {
    args.data.barColor = "red";
  }
};

Let me know if this isn't what you are looking for.

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