Is it possible to divide cells in ag-grid?

Question

I would like to make some columns have 3 cells inside one cell (example on the screenshot). I tried to do it in different ways: using rowSpan, changing the height of the row/cells, but none of these ways worked for me. How can I implement this in ag-grid ?

image 1

Answer 1

You can achieve this using Row Spanning, please see this implemented in the following Plunkr

The key here is the rowSpan callback:

const rowSpan = (params) => {
  const columnId = params.column.getColId();
  if (params.data[columnId] === 'row 1') {
    return 3;
  } else if (params.data[columnId] === 'row 2') {
    return 3;
  } else if (params.data[columnId] === 'row 3') {
    return 3;
  } else {
    return 1;
  }
};