Odd and even rows coloring on one level

Gantt
#1

Hello, I would like to make different colors for odd and for even row.
But the thing is that I would like to separate rows only on the parent level.

Right now I am adding class like that:

if(task.$level == 1) {
    console.log("DANT");
angular.element(".gantt_row.task-inner-parent:nth-child(odd)").addClass("task-odd");
angular.element(".gantt_row.task-inner-parent:nth-child(even)").addClass("task-even");
 }

The issue is that every time I expand any parenting task, the whole Gantt is rendered again and classes are added wrongly as you can see attached image.

gantt
gantt1064×378 28.9 KB

The reason why I would like to implement this is that I would like to have child tasks background same as for parent class

#2

Hello Pavel,
You need to check the task index within the branch by using the getTaskIndex method:
https://docs.dhtmlx.com/gantt/api__gantt_gettaskindex.html
Also, don’t forget to add the odd class name in the style rules, otherwise some rows won’t be highlighted.
Regarding child tasks, you check the index within the branch of their parent task.
Here is an example of how it might be implemented:
http://snippet.dhtmlx.com/ad2629ab9

#3

Thank you!

It works but I have one additional question. Do you know how to apply this logic to the right “calendar” fields as well?
Currently, I am using this but it is not working properly:

image
image727×323 9.23 KB

basically, I would like to set a background for all rows.

Thank you :slight_smile:

#4

I’ve already figured it out.

Thank you, once more

Bye