开发者论坛

 找回密码
 注册 (请使用非IE浏览器)
查看: 4430|回复: 0

Kendo UI Web开发:看如何实现隐藏的容器

[复制链接]

0

精华

8

贡献

1768

赞扬

特约版主

帖子
583
软币
4524
在线时间
275 小时
注册时间
2019-2-21
发表于 2020-9-11 09:43:44 | 显示全部楼层 |阅读模式
Kendo UI目前最新提供Kendo UI for jQueryKendo UI for AngularKendo UI Support for ReactKendo UI Support for Vue四个控件。Kendo UI for jQuery是创建现代Web应用程序的最完整UI库。
隐藏的容器
如果在隐藏的容器内初始化Grid,则Grid可能无法正确调整其布局。
例如,当您应用滚动、虚拟滚动或锁定的列并在隐藏容器中初始化Grid时,将无法正确调整其垂直布局,因为JavaScript尺寸计算不适用于display:none样式的元素。
如果出现以下任何情况,则可以确定网格是在隐藏状态下初始化的:
  • 网格看起来小于预期
  • 可滚动的数据区域溢出了网格的底部边框
  • 即使启用了虚拟滚动,垂直滚动条也不可见
  • 冻结的列太窄,非冻结的列不可见
  • pager可能不会出现,或者可能是最小的pager,而不是完整的pager
若要处理与隐藏容器内的网格初始化有关的操作,请选择以下任意一种方法:
1. 延迟Grid的初始化或更改各种Kendo UI窗口小部件的初始化顺序,以便在其元素可见后初始化Grid。
2. 小部件可见后,执行Grid的resize方法。
3. 替代其配置中的网格设置整体高度,而仅可滚动数据区域定义高度。在这种情况下,不进行高度计算。 仅当不使用冻结列和虚拟滚动时,此方法才适用。
[HTML] 纯文本查看 复制代码
#GridID .k-grid-content
{
height: 270px;
}

4. 获取数据源,替代resize()方法。如果启用了虚拟滚动并且Kendo UI版本低于2014.3.1119,则此方法适用。
[JavaScript] 纯文本查看 复制代码
$("#GridID").data("kendoGrid").dataSource.fetch();




回复

使用道具 举报

Archiver|手机版|小黑屋|开发者网 ( 苏ICP备08004430号-2 )
版权所有:南京韵文教育信息咨询有限公司

GMT+8, 2024-4-26 00:31

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表