Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Joey Kronawetter
105
Grid not contained when resizing columns without horizontal scroll bar
posted

I'm having an issue with resizing a grid that has rowVirtualization turned on.

The issue is that if the grid is initialized with columns set wide enough to generate a horizontal scrollbar, then resizing the grid works fine. The grid stays contained by its parent div. If the grid is initialized without the need for a horizontal scrollbar, then on resize the grid will stretch past the width of its parent. As a note, the grid width is set to 100% and the column widths are set in pixels.

I've needed to deal with the grid_hscroller element to fix an issue with hiding and resizing where after the operation the grid was snapped back to the leftmost scroll position, however if a scroll bar was not present on initialization, this element is never on the dom. Also, the grid has a column that by default will be hidden. I have tried making it visible then hiding it after its databound and this works to make the grid_hscroller element appear when the grid is scrolled wide enough, the issue is that this won't work on all screen resolutions. If the user has a screen that would fit all of the columns without needing to render the horizontal scrollbar, then after hiding the column it still wouldn't be there.

I have tried setting the width for the grid, grid_displayContainer, and grid_virtualDisplayContainer and none of that worked either. However, after realizing the issue with the scroll element never getting placed on the dom, this would not have helped anyway. If it did succeed in restraining the grid to the original width, I wouldn't be able to scroll to see what was beyond it.

If there was a way to set column widths programmatically after the grid was initialized, then I could set them all to be very wide to begin with then change them after data binding.

Included is the screenshot of the grid as normal (top) and stretched (bottom) after resizing the Program column.

Is there a way to force the horizontal scroll elements to appear at all times or a way to programmatically change the widths of the columns at run time? Either one of these scenarios would solve my issue. Thank you for your time.