As the subject suggests I'm attempting to alter body width to match the width of the grid in cases where the grid ends up bigger than the body. I'm attempting to do that by wiring up the databound event of the grid and then setting the width of the body. However, the grid's width is returning smaller than it actually is so the body is still left behind.
For example, I have a min-width set on the body element in css. In this case it's 1100px. The grid is reporting its width as smaller than that min-width (1088), yet the grid goes well past that width on the screen. Here is the javascript I am trying to use to accomplish this. Any suggestions?
For example, I have a min-width set on the body element in css. In this case it's 1100px. The grid is reporting its width as smaller than that min-width (1088), yet the grid goes well past that width on the screen. Here is the javascript I am trying to use to accomplish this. Any suggestions?
$(function () { var grid = $(gridNameForEditors).data("kendoGrid"); grid.bind("dataBound", function () { var grid2 = $(gridNameForEditors); alert(grid2.width()); document.body.style.width = grid2.width() + "px"; }); })2 Answers, 1 is accepted
0
Fred
Top achievements
Rank 1
Rank 1
answered on 25 Jul 2013, 03:21 PM
So, as a temporary fix I set a TableHTMLAttribute on the grid to give the table an id which could be queried. Turns out it was the underlying table the grid generated which was the offender and I had been getting the surrounding div which had a smaller width than the table. Then I could switch up my javascript to get the width of that table and set document width to that.
However, this isn't really an ideal situation. So I suppose I'll have to figure out how to better constrain the grid so it is always a fixed width. If anyone wants to save me the trouble and point me to the right place to look, that'd be awesome! ;)
However, this isn't really an ideal situation. So I suppose I'll have to figure out how to better constrain the grid so it is always a fixed width. If anyone wants to save me the trouble and point me to the right place to look, that'd be awesome! ;)
0
Hi Fred,
Dimo
Telerik
By default, the Grid <div> adjusts its width according to its container, while the <body> adjusts its width, according to its content. Depending on the exact layout implementation and Grid configuration, you may not get the expected results.
Here is some more related information:
http://docs.kendoui.com/getting-started/web/grid/walkthrough#using-a-wide-non-scrollable-grid
Dimo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!