Question

HY，

在我的应用中，我使用Telerik扩展进行MVC网格控制：

有没有人知道为什么当我调整窗口大小（在任何浏览器中）时，垂直或水平滚动没有出现？

我将网格的宽度和高度设置为100％。

 @(Html.Telerik().Grid<MyViewModel>()
      .Name("MyGrid")
      .HtmlAttributes(new { style = "display:table; width:100%; height: 100%;" })
...)

我甚至尝试将网格放入宽度和高度均为100％的div中...当我调整窗口大小时仍然没有滚动。

提前致谢，

杰夫。

Answer 1

您是在寻找整个窗口的滚动条，还是仅仅是Grid？

我在Grid上有滚动条，当我在网格周围添加div时，将高度设置为100px，并将overflow设置为auto：

<div style="height: 100px; overflow:auto;">
    @(Html.Telerik().Grid<MyViewModel>()
      .Name("MyGrid")
    ...)
</div>

这听起来不像网格问题，而是HTML。添加更多代码以及有关您要完成的更多详细信息。

Answer 2

我找到了解决方案。不知何故，页面的样式有'溢出：隐藏';设置为'auto'后，所有滚动都在那里。

Answer 3

对于Vertical Scroll，我们可以使用以下内容，而对于水平滚动，只需使用div

<div class="DataGridXScroll">

@(Html.Telerik().Grid(listCustomerStatus)
                .Name("grvSalesAdjustment")
                .DataKeys(keys => keys.Add(k => k.CustCode))
                .Columns(column =>
                {

                })
               .Selectable()
               .Pageable(page => page.PageSize(100))
               .Scrollable(scroll => scroll.Height(300))
)
 </div>

添加以下 CSS

.DataGridXScroll
{
    width: 1000px;   
    overflow-x: scroll;
    text-align:left;
}

这适用于Firefox和其他浏览器。对于 IE ，只需使用以下 CSS

.t-grid
{
   position: static;
   overflow:hidden;
}

.t-grid-content
{
   overflow-x: hidden;
   position:static; 
   width:100%;  
}

.t-grid-header-wrap
{
   position:static;    
}

.t-grid-content
{
   overflow-x: hidden;    
}

.t-grid-footer-wrap
{
  position:static;
}

Answer 4

设置触发滚动条的特定宽度。样品;

.Scrollable（scr =＆gt; scr.Height（430））

希望它有所帮助！

使用Telerik MVC扩展，网格控件，为什么在调整窗口大小时不会出现垂直和/或水平滚动？

4 个答案: