Data Grid-horizontal scrolling in a flexbox layout with a sidebar

1 Answer 153 Views
Grid
David
Top achievements
Rank 1
David asked on 06 Apr 2024, 05:24 AM

With a sidebar-grid layout, where the grid has resizable column widths, I cannot get the grid to generate a horizontal scrollbar. The documentation "advice" in useless on this: setting explicit column width larger than the width doesn't work and is a hack. Without the sidebar (e.g. outside of a parent flex that maintains the sidebar), resizing a column larger generates the horizontal scrollbar just fine. There's nothing documented I can find as to what the layout expectations of the datagrid are, and I'm really frustrated at hacking at it.

What are the specific layout expectations of the datagrid to generate a horizontal scrollbar? This is a common UI idiom- why is it so hard to get a grid to occupy the full width of its container and scroll when constrained?

    

1 Answer, 1 is accepted

Sort by
0
Vessy
Telerik team
answered on 09 Apr 2024, 03:39 PM

Hello, David,

Can you, please, elaborate a bit on the sidebar-grid-layout that you are mentioning and the exact setup that you are using when the Grid does not show a Scrollbar? By default, if the width of the Grid is set and the sum of its columns is bigger than the calculated Grid width - it will show a horizontal scrollbar. You can test this behavior in the following sample by resizing the preview window of Stackblitz:

Is this the behavior you are trying to achieve or are you after a different result? It will be really helpful if you can prepare and send me a small sample where the undesired behavior can be reproduced (along with the steps to do so) and point us a demo/video of a Grid (e.g. with a different implementation) that showcases the behavior that you would like to have. 

Looking forward to receiving a reply from you.

Kind regards,
Vessy
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources!

Tags
Grid
Asked by
David
Top achievements
Rank 1
Answers by
Vessy
Telerik team
Share this question
or