Ag-grid React Table TypeError: Cannot read properties of undefined (reading 'setAriaColIndex')

Question

Good night, I'm working with ag-grid on a React project. I created a component that the user can enable column visibility, so far so good, it works perfectly. However, when running a function to set the visibility of all columns, the error mentioned in the title occurs. The function that does this is below. But another point is that this only happens if reactUi={true} is enabled, if disabled it works perfectly.

 const handleOnChange = (e, i) => {
    var columnApi = props.columnApi;
    columnApi.setColumnVisible(e.target.value, e.target.checked);
  };

  const handleAllChange = (e) => {
    var columnApi = props.columnApi;
    for (let index = 0; index < columns.length; index++) {
      columnApi.setColumnVisible(columns[index].colId, e.target.checked);
    }
  };

Did you find out why this is happening? Please add ag-grid to the tags — AshTyson, Dec 31 '21 at 22:28
For any one stumbling on this issue, For my use case I wanted to hide multiple columns so I was doing `[colId].forEach => columnApi.setColumnVisible`, and it was throwing the above error, but `columnApi.setColumnsVisible([colids])` solved the issue. — Yogesh, Feb 15 '22 at 07:23

score 2 · Answer 1 · answered Mar 30 '22 at 04:48

I had the same issue. the reason was a misalignment between the versions on the package.json file. I changed the versions to be the same and the issue was fixed.

Example:

    "ag-grid-community": "^25.3.0",
    "ag-grid-enterprise": "^25.3.0",
    "ag-grid-react": "^25.3.0",

Ag-grid React Table TypeError: Cannot read properties of undefined (reading 'setAriaColIndex')

1 Answers1