I am new to ag-grid. As seen in the screenshot below, I have 4 columns initially. When I remove column 3 (test3), notice that there is space on the right that indicates that a column in missing. How can I ensure that once a column is removed, that the remaining 3 columns (in this case) will fill the area? I tried to pass resizable : true into defaultcolDef but that did not fix the issue...
Use flex: 1 on each column.
See the documentation here for more info: https://www.ag-grid.com/javascript-data-grid/column-sizing/#column-flex
Or checkout this plunker example: https://plnkr.co/edit/7evoWXCM1sChDBmX
Just drag one of the columns out of the grid to see it working
You can use the columnVisible-event to catch any columns added or removed
https://www.ag-grid.com/javascript-data-grid/grid-events/#reference-columns-columnVisible
and then call
gridOptions.api.sizeColumnsToFit();
https://www.ag-grid.com/javascript-data-grid/column-sizing/#size-columns-to-fit