This is a migrated thread and some comments may be shown as answers.

Can't enable horizontal scrolling in grid

2 Answers 235 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Brian Vallelunga asked on 29 Apr 2013, 07:06 PM

colgroup-problem.png

I can not get my grid to scroll horizontally at all. I'm using the MVC wrapper and have the following code:

@(

Html.Kendo()

.Grid<MyModel>

.Name("grid")

.DataSource(…)

.Scrollable()

.Columns(columns =>

{

columns.Bound(…).Width(300);

columns.Bound(…).Width(200);

columns.Bound(…).Width(300);

columns.Bound(…).Width(200);

columns.Bound(…).Width(500);

})

)

This results in a table that squishes the columns to fit the width of the table, instead of triggering a horizontal scroll bar. The grid's content table has a table-layout of "fixed" with a width of 100%. The problem seems to be that inside of the generated tables is a nested colgroup. Instead of:

<table><colgroup><col /><col /></colgroup>...</table>

I see

<table><colgroup><colgroup><col /><col /></colgroup></colgroup>...</table>

What could be causing this? I'm using the latest version (2013.1.319). What's interesting is that this only appears in how the colgroup is parsed and rendered by the browser. The actual source only has the single colgroup element. Check out the attached screenshot to see what Firebug displays versus the source. There is a difference between what I see in "View Source" and "View Generated Source".

Just a guess, but is the kendoGrid jQuery call adding an additional colgroup? It seems the MVC helper is already building a table with it.

Can't enable horizontal scrolling in grid

2 Answers, 1 is accepted