Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Yudhi Seymour on Nov 30, 2008 17:30
open dhtmlx forum
Resizing grid with browser window

Hi,

We are initialising a grid within a div element which has its width property set to "100%".

When the browser window is enlarged, the grid does not resize with it.

Is there any way to get it to maintain 100% width at all times?

Cheers,
Answer posted by Support on Dec 01, 2008 02:16
The grid will resize automatically in next cases
- column's width set in percents ( setInitWidthsP )
- at least one of columns set to auto-size ( * as size )

In any case you can use code similar to next
dhtmlxEvent(window,"resize",function(){
     grid.setSizes();
});


Answer posted by Yudhi Seymour on Dec 01, 2008 19:05
Applying the grid.setSizes call on the window.resize event did not have any effect however after some more testing I have isolated the problem down to the split functionality.

If I call splitAt(1) to fix the leftmost column in place, the right-hand side of the grid no longer expands to fit the browser window.

It appears that this is because the absolutely-positioned table which contains the right-hand side of the grid has two widths specified:  a value of '100%' specified in the 'width' attribute of the table element, and a value in pixels (presumably calculated at the time of loading) specified using the 'style' attribute.  If I remove the CSS width attribute, the grid resizes normally.

Is there any reason that it works this way, or could the code be modified so that only the 100% specification remains?

Cheers
Answer posted by Support on Dec 02, 2008 02:33
In case of split mode, please try to use next code in onresize event handler
     grid.setSizes();
     grid._fake._correctSplit();
It will force an update for both left and right parts of grid. 
Answer posted by Yudhi Seymour on Dec 02, 2008 15:30
Excellent.  Thanks.