Grid In Table Solution !!!
what its container is (table, tr, td, div...etc).
Presented here is just the direction for the solution and it works.
Final solution should be more complex and based on values recieved from the object model and not hardcoded, to preserve grid dynamics.
... // set grid height in pixel var intTotalRows = 25 // ex. like obj.getRowProperty("count"); var pxRowHeight = 26; // ex. like row.getStyle("height"); var pxHeaderHeight = 20; // ex. like obj.getColumnHeaderHeight(); var pxFooterMargin = 5; // should be minimum 3 // calc grid height (used 2 rows for reading simplicity) var pxGridHeight = (pxRowHeight * intTotalRows); pxGridHeight = pxGridHeight + eaderHeight + pxFooterMargin ; // apply design to grid obj.setStyle("height", pxGridHeight);
Grid Style attribute is set to the correct grid height in pixels and so grid is presented in full height and not cropped by container, because there is no more overflow and no need for scrolling.