grid_row_class

Gibt die CSS-Klasse an, die auf eine Zeile im Grid angewendet wird

start	Date	Das Datum, an dem eine Aufgabe geplant ist zu beginnen
end	Date	Das Datum, an dem eine Aufgabe geplant ist, abgeschlossen zu werden
task	Task	Das Aufgabenobjekt

Example

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

Jede zweite Zeile des Grids und der Zeitachse enthält eine zusätzliche CSS-Klasse mit dem Namen odd, die verwendet werden kann, um die Farben der Zeilen abwechselnd zu gestalten:

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

Standardmäßig werden die Stile nur auf gerade Zeilen angewendet. Um ungerade Zeilen zu gestalten, müssen Sie den Klassennamen odd zu den Selektoren der Stilregeln hinzufügen. Daher müssen Sie, wenn Sie allen Zeilen die gleiche Farbe zuweisen möchten, in der Regel eine CSS-Regel für beide Selektoren (mit und ohne '.odd'-Klasse) angeben, andernfalls werden die Standard-CSS-Regeln spezifischer und haben eine höhere Priorität.

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

Das Gleiche gilt für die benutzerdefinierten CSS-Klassen, die Sie über die grid_row_class und task_row_class Vorlagen anwenden können:

index.js

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

index.css

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

Sie werden feststellen, dass die geraden Zeilen auf dem Bildschirm hervorgehoben sind, anstatt die ungeraden. Aber wenn Sie die Indizes der Zeilen überprüfen, werden Sie sehen, dass der Stil auf die Zeilen angewendet wird, die ungerade Indizes haben (1, 3, 5, usw.).

Zurück nach oben