Want the ag grid to auto size when number of rows is small but have a fixed height with a scroll bar when number of rows exceed a threshold

I have a dynamic ag grid output which displays on a click event. It can have any number of rows from 1 to 1000. When the number of rows is smaller I want it to autosize so that I don’t see any empty space. But when the height of the grid becomes larger than 400, I want scroll button to appear. I tried putting domLayout=‘autoHeight’ in dashGridOptions and ‘max-height’:400 in style but to no avail. Can anyone help?

Hello @ssingh80,

You could try maxHeight with overflow: auto and see what it does.

Hi it seems to work. but it is somehow fixing the min height to twice the height I supplied for a row. So when there is 1 row, it leaves space for another row. When the number of rows are greater than or equal to 2, it works perfectly.

Have you also adjusted the regular height of the grid?

Here is the code for the grid

dag.AgGrid(id = “output-cell-click-data”,
className = “ag-theme-alpine”,
rowData = opl_rows,
columnDefs = opl_columnDefs,
columnSize = “sizeToFit”,
dashGridOptions = {“rowHeight”: 70,‘domLayout’:‘autoHeight’},
style={“maxHeight”: 420,‘overflow’:‘auto’}

Make sure you also pass a regular height to override the default of the grid.

The rowHeight isn’t taking all the time?

adding height parameter fixes the height of the grid. It removes the benefit of all things we did.

Set it to None then.