Time table

Column- and rowspan

Merging table cells can be achieved by overriding the getRowspanAt() method of the respective AreaModels:

class TimeTableBodyModel extends AreaModelObjectArrayWithColumndefs<TeamDataIf> {

  constructor(rowHeight: number) {
    super("body", data, columnDefs, rowHeight);
  }

  override getRowspanAt(rowIndex: number, columnIndex: number): number {
    if (columnIndex === 0 || columnIndex == 1) {
      const v = this.getValueAt(rowIndex, columnIndex);
      if (rowIndex === 0 || v !== this.getValueAt(rowIndex - 1, columnIndex)) {
        return this.countNextWithValue(rowIndex, columnIndex, v);
      }
    }
    return 1;
  }

  private countNextWithValue(rowIndex: number, columnIndex: number, value: any): number {
    let ret = 1;
    while (value === this.getValueAt(rowIndex + ret, columnIndex)) {
      ret++;
    }
    return ret;
  }
}

Updating table cells

Table cells (in both the header, body, and footer) can be updated by utilizing the method setValue().

With numerous updates, it might be more efficient to pass the changes as an array of TableCellUpdateEvent to the method updateCells().

this.tableApi?.updateCells([new TableCellUpdateEvent("body", row, col, val, cssClasses)]);