grid_row_class

определяет CSS-класс, который присваивается строке grid

start	Date	дата начала задачи
end	Date	ожидаемая дата окончания задачи
task	Task	объект задачи

Example

gantt.templates.grid_row_class = function(start, end, task){
    return "";
};

Каждая вторая строка как в grid, так и в области timeline содержит дополнительный CSS-класс odd, который можно использовать для создания чередующихся цветов строк:

.gantt_row.odd, .gantt_task_row.odd{
    background: silver;
}
 
.gantt_row, .gantt_task_row {
    background: white;
}

По умолчанию эти стили применяются только к четным строкам. Чтобы стилизовать нечетные строки, класс odd должен быть добавлен в селекторы ваших CSS-правил. Поэтому, если вы хотите, чтобы все строки имели одинаковый цвет, обычно нужно включить правила для обоих селекторов (с классом '.odd' и без), так как стандартные CSS-правила имеют более высокий приоритет и перекрывают остальные.

.gantt_row.odd, .gantt_task_row.odd,
.gantt_row, .gantt_task_row {
    background: white;
}

Этот подход также применяется к пользовательским CSS-классам, назначаемым через шаблоны grid_row_class и task_row_class:

index.js

gantt.templates.grid_row_class = function(start, end, task){
    return "wheat_color";
};

index.css

.wheat_color,
.wheat_color.odd{
    background:wheat;
}

Вы можете заметить, что на экране подсвечиваются четные строки, а не нечетные. Однако, если проверить индексы строк, вы увидите, что стили применяются к строкам с нечетными индексами (1, 3, 5 и так далее).

К началу