How to get column index on Cell Click event in ag-grid?

Question

I think of simplifying the click events and instead of attach them on column renderer (I use React), I tried to attach a single onCellClicked event (where I do get all the data for the row) and do a switch for... column. On first column there will be a delete button, on second something else, etc. I do have some colDef and column, but no index for the column. Instead I have a colId, which isn't what I need. I do have a colDef, where column header could be used, but for my case I don't have headers. I can't imagine how they omitted the column index.

I have to admit that I could use the solution with defining the colId when passing column definitions as ag-grid children; so while that is more robust, the presence of colIndex could still be helpful in some cases I think — Paul Pacurar, Oct 09 '21 at 21:42

score 2 · Answer 1 · answered Oct 10 '21 at 06:43

You can get all columns and find its index based on the field property if you don't provide the colId:

<AgGridReact
  {...}
  onCellClicked={(e) => {
    const field = e.colDef.field;
    const colIndex = e.columnApi
      .getAllColumns()
      ?.findIndex((col) => col.getColDef().field === field);

    console.log(field, colIndex);
  }}
/>

How to get column index on Cell Click event in ag-grid?

1 Answers1