Our pure JavaScript Scheduler component


Post by eccdakaj »

Hi.
My case is (Angular 7):
A) User select one or more resources on scheduler
B) I have to highlight - change background color (adding - removing css classes) of the grid rows of selected resources AND of the grid rows of events of selected resources.

In plain javascript it's ok:
- i get the selected resources from event "selectionchange"
- i "find" (exploring dom) the resource rows and the event rows
- i add/remove css classes

In Angular, i does not have access to rows of scheduler as components, and i can't use direct dom manipulation to change css class.
Any suggestion?

Post by mats »

Easier than that! We already apply a CSS rule for selected rows so just use ".b-grid-row.b-selected" to style the rows as you want.

Post by eccdakaj »

I have to handle a more complex situation: different styles for resource row (selected style 1, unselected style 2) and event row (style 3, style 4), different styles for elements inside the resource row etc ...

In any case, I solved the problem this way:
- I save, on the selectionchange events, the "status" of the selection
- on the cellclick event, based on the "status" of the selection, I add / remove the css classes in the "elements" of the scheduler (selection by XPATH)

Thank you

Post Reply