How do I change the color of individual row header cells?

Asked by Gaz Black
10 years ago.

Hi,

We've just starting using the Scheduler control and have come across a requirement we cannot apply. We want to be able to style cells against resources individually (back and fore color) but cannot find any options.

We've checked the API documentation. Within the following link:

https://api.daypilot.org/daypilot-scheduler-resources/

...you can style the background color for a resource row but cannot style separate cells.

I know you can use the cssClass property but each cell could potentially have any bespoke color background or fore.

Any help will be greatly appreciated.

how-to javascript

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

In the latest build (8.1.2007) the resource.columns[] array supports .backColor and .cssClass properties (in addition to .html).

Example:

dp.resources = [
{ name: "Room 101", id: "101", columns: [{html: "Floor 1", backColor: "#ccc"}, {html: "2 beds", cssClass: "highlight" }] },
{ name: "Room 102", id: "102", columns: [{html: "Floor 1"}, {html: "3 beds"}] },
{ name: "Room 103", id: "103", columns: [{html: "Floor 1"}, {html: "1 bed"}] },
{ name: "Room 201", id: "201", columns: [{html: "Floor 2"}, {html: "2 beds"}] }
];

You can also reach the column data in onBeforeResHeaderRender using args.resource.columns[]:

https://api.daypilot.org/daypilot-scheduler-onbeforeresheaderrender/

You can download the latest build in the sandbox:

http://javascript.daypilot.org/sandbox/

Comment posted by Gaz Black
10 years ago.

Many thanks for the quick reply Dan.

Brilliant news, that's the back color sorted. Is there anyway of applying a fore color to individual cells? We can't use a CSS class as the fore color is completely bespoke too.

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