This question is locked. New answers and comments are not allowed.
I'm having trouble docking controls within a splitter pane so that they fill the pane and resize properly when the splitter resizes. Particularly, I cannot get a Grid to dock and resize correctly. Does anyone have any examples they can point me towards that demonstrate really good layout behavior using the splitter?
The UI behavior I'm trying to accomplish is:
1. On initial load, the grid should fill the splitter pane so that the control portions of the grid (toolbar, group panel, paging panel) are visible. The visible rows are scrollable if paging size causes grid height to exceed available space in splitter pane.
- Currently, the grid fills the pane on initial load, but in a way that requires scrolling down to get to the paging toolbar.
Optionally, can the paging toolbar be moved to the top of the grid?
2. When the browser window is resized, grid should expand/shrink accordingly, with the toolbars always visible and only the number of visible rows changing.
-The splitter itself is resizing along with the window, but the controls within it do not resize unless I move a splitter bar. I've attempted adding the following from a "FullScreenSplitter" example found in another thread:
3. When splitter bars are resized, grid should expand horizontally or vertically accordingly. The grid should always fill the pane so that toolbars are always visible at the top and bottom of the pane. If the pane is expanded vertically beyond the height of the grid, the empty space should appear between the last visible row and the bottom of the grid/paging toolbar.
Thank you.
Don
The UI behavior I'm trying to accomplish is:
1. On initial load, the grid should fill the splitter pane so that the control portions of the grid (toolbar, group panel, paging panel) are visible. The visible rows are scrollable if paging size causes grid height to exceed available space in splitter pane.
- Currently, the grid fills the pane on initial load, but in a way that requires scrolling down to get to the paging toolbar.
Optionally, can the paging toolbar be moved to the top of the grid?
2. When the browser window is resized, grid should expand/shrink accordingly, with the toolbars always visible and only the number of visible rows changing.
-The splitter itself is resizing along with the window, but the controls within it do not resize unless I move a splitter bar. I've attempted adding the following from a "FullScreenSplitter" example found in another thread:
@(Html.Telerik().ScriptRegistrar() .DefaultGroup(group => group .Combined(true) .Compress(true) ) .OnDocumentReady(@<text> var splitter = $('#FullScreen').data('tSplitter'); $(window).bind('resize', function() { splitter.resize(); }); </text>))3. When splitter bars are resized, grid should expand horizontally or vertically accordingly. The grid should always fill the pane so that toolbars are always visible at the top and bottom of the pane. If the pane is expanded vertically beyond the height of the grid, the empty space should appear between the last visible row and the bottom of the grid/paging toolbar.
Thank you.
Don