Kendo UI for jQuery数据管理使用教程：连续滚动

Kendo UI目前最新提供Kendo UI for jQuery、Kendo UI for Angular、Kendo UI Support for React和Kendo UI Support for Vue四个控件。Kendo UI for jQuery是创建现代Web应用程序的完整UI库。

当您显示大量项目并使用编辑、分组、过滤、排序或层次结构时，连续滚动非常适合。

网格连续滚动本地数据的演示：

”stylesheet” href=”styles/kendo.common.min.css” />
”stylesheet” href=”styles/kendo.default.min.css” />
”stylesheet” href=”styles/kendo.default.mobile.min.css” />

”example”>

”grid”>

网格连续滚动远程数据的演示：

”stylesheet” href=”styles/kendo.common.min.css” />
”stylesheet” href=”styles/kendo.default.min.css” />
”stylesheet” href=”styles/kendo.default.mobile.min.css” />

”example”>

”grid”>

入门指南

要启用连续滚动，请将scrollable.endless属性设置为true。

注意：为了使功能正常工作，有两个要求：

• 需要一个垂直滚动条

• 网格的高度应恒定

当网格绑定到本地和远程数据时，它们都支持连续滚动：

• 当绑定到本地数据数组时，网格会将所有项目序列化到客户端，并且在用户滚动时，小部件将显示新项目。

• 当绑定到远程数据时，网格仅将一页的项目序列化。 当用户滚动到列表的末尾时，网格将发送AJAX请求以获取下一页的项目。返回数据后，网格仅呈现新项目并将其追加到旧项目。

$(“#grid”).kendoGrid({
scrollable: {
endless: true
},
// Other configuration.
});

与编辑一起使用

与常规分页一样，连续滚动与编辑方式相似，但是当您与编辑一起使用连续滚动并打开一个项目进行编辑时，即使在请求新页面之后，该项目仍将保持打开状态。

与分组一起使用

• 开箱即用，连续滚动与分组一起工作，但是当两个功能一起使用时，网格将以以下特定方式运行：

• 如果将网格滚动到底部，它将请求的项目数将等于项目数和页面大小。

• 如果最后一组项目被折叠，则网格仍将请求该组中的项目。

• 如果一组项目跨越多个页面，则网格将发出多个请求。

• 当返回特定的项目子集时，这些项目将被渲染和隐藏，因为该组已折叠。 网格将继续请求这些项目，直到到达新的组或直到不存在任何要请求的项目为止。

• 如果网格绑定到远程数据，请启用serverGrouping将分组应用于所有项目。

与层次结构一起使用

如果网格显示层次结构数据并且展开了某个项目，则在滚动这些项目并请求新页面时，该网格不会折叠。

注意：筛选、排序和分组操作将重置滚动位置。

公司名称：北京哲想软件有限公司

北京哲想软件官方网站：www.cogitosoft.com

北京哲想软件微信公众平台账号：cogitosoftware

北京哲想软件微博：哲想软件

北京哲想软件邮箱：[email protected]

销售（俞先生）联系方式：+86（010）68421378

微信：18610247936 QQ：368531638