I have a datagrid that is updated periodically and the number of rows inside it grows steadily over time. It is inside of a parent div with a height of 60% of the screen.
If I set autoheight to, say, 5 rows, the table works properly. When a sixth row is added, a scrollbar appears within the datagrid and I can scroll up/down and the headers remain fixed at the top and visible. Unfortunately, once I have a lot of data, this is a waste of space -- I have 60% of the screen's height to work with, but only 5 rows are being shown at a time.
If I set autoheight to false, the scrollbar that appears is attached to the parent div. Scrolling up/down allows me to see the data, but the headers at the top of the grid scroll out of view.
Is there a way to ask the datagrid to show as many rows as it can fit and provide a scrollbar for the rest?
---- EDIT ----
Setting autoheight to false would be exactly what I want if the datagrid would resize itself along with the parent when I resize my browser. Is there a good way to achieve that?