I have a grid whose height is set on server side while it loads. The grid also have filtering which will show few rows (less than 5) when filter applied.
The problem is when the filter is applied and the grid height is unchanged, the rows span over the available height of the grid with more space between the rows. I want to avoid this space and have all the rows together. If any one knows a solution, please help.
I have achieved this by placing the grid inside a cell of html tabel and set the hight and width of table, cell and grid to 100%. This keeps the page size always 100% of the browser window and the grid scrollbar are activated in 'auto' mode if necessary.
But since updating to version 2007.3 (?) the grid dont enables its scrollbars. Now the scrollbar of the page appears. But what I want is the old behaviour. How can I achieve this again ? Only if I set the grid height to fix value (pixels) the scrollbars appear.
Thanks for any help.
Markus
Hello,
1. Check the generated code for an UltraWebGrid.
2. You will find a table having an ID like this:
<table id='G_uwgMyGrid' bandNo='0' StationaryMarginsOutlookGroupBy='True' height='100%' border='0'......
3. Set in the .css file like this
#G_uwgMyGrid{ height: auto;}
The rows will not occupy the grid 100% anymore, only as much height as necessary.
I'm pretty sure that div is used for the loadOnDemand functionality of the grid - either that or for the "stationarymargins" (fixed header). Sounds like it might have it's height set to 100% coming from somewhere. Easiest way to find out is to use the IE Developer Toolbar (go to microsoft downloads and search for ie developer toolbar). There's a great dom exploerer included in that which will allow you to find out exactly what CSS is being applied to that container to make it sized the way it is.
-Tony
Thanks a ton. That solves my problem.
I am using
div.style.maxHeight = gridHeight;
This satisfies my requirements.
But the only problem after doing this is when I do a server side sort or filter then there is an extra div tag added below the contents of the grid with ID G_ctl00xcphPageContentxuwgWebGrid_scd which doesnt have any contents but its height is more than double the contents of the grid.
I have suppressed the above div using
div = grid.getDivElement();
div.childNodes[1].style.display = 'none';
but wanted to know why the div is rendered.
The problem is that when you filter the results the entire grid doesn't re-render. You need to force the entire grid to re-render so that you get the behavior your looking for. You can do this with an UpdatePanel. Alternatively, you can try setting MaxHeight css properties. These will work in IE7 as long as you're in Standards Mode (xhtml).