KendoUIforjQuery数据管理使用教程：搜索面板、分页功能 |
您所在的位置：网站首页 › pageable分页 › KendoUIforjQuery数据管理使用教程：搜索面板、分页功能 |
KendoUIforjQuery数据管理使用教程：搜索面板、分页功能
|
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库。 Kendo UI for jQuery数据管理中，网格的搜索面板和分页功能。
搜索面板 网格小部件具有内置功能，使用户可以搜索数据。搜索面板在后台使用过滤功能来仅显示网格中的相关记录。
入门指南 要启用该功能，请在工具栏配置中包含搜索选项。另外，可以自定义搜索输入中输入值时要搜索的字段。 $(“#grid”).kendoGrid({ toolbar: [“search”], search: { fields: [“ContactTitle”] } … });
已知局限性 在过滤器文本框中启用过滤后，所有Grid列的数据将使用在搜索文本框中输入的值填充。
分页 默认情况下，禁用网格中的分页。
入门指南 要启用网格的分页功能，请将其pageable选项设置为true。 为了使分页正常工作： 定义要在每个页面上显示的网格记录数。 定义数据集中的记录总数。 在数据源上指定pageSize，并在数据集中指定将包含记录总数的字段。 $(“#grid”).kendoGrid({ pageable: true // Other configuration. });
在服务器上分页 为了增强Grid的性能，通过将数据源的serverPaging选项设置为true，在服务器上应用分页操作。启用serverPaging时，数据源将以下默认参数发送到服务器： top参数定义在响应中发送回的记录数。 skip参数定义从数据集开始要跳过的记录数。例如，要显示60条记录的数据集中的第3页（每页分为10条记录），网格将发送skip: 20, top: 10。 Grid与发送和接收JSON有效负载的HTTP请求一起使用。 例如，要将窗口小部件绑定到特定数据子集的特定页面，请指示dataSource使用serverPaging。 结果，它将直接使用接收到的数据。相同的规则适用于过滤、分组、聚合和排序操作。 $(document).ready(function(){ $(“#grid”).kendoGrid({ groupable: true, scrollable: true, sortable: true, pageable: true }); });
配置Pager 默认情况下，即使网格的数据源项总数小于pageSize值，它也会显示一个pager。 从Kendo UI 2017 R3版本开始，网格使您可以通过pageable.alwaysVisible配置属性来切换pager的可见性，如果pageable.alwaysVisible值为false，则pager将获得以下操作： 当最初在数据源中设置的项目总数小于pageSize值时，将隐藏该pager。 当数据源中最初设置的项目总数大于或等于pageSize值时，将显示pager。 如果在pageSize中执行删除、筛选或更新操作后，数据源中的项目总数小于pageSize值，则将隐藏该pager。 如果在插入、筛选或pageSize更新后，数据源中的项目总数大于或等于pageSize值，则将显示pager。
Configure
公司名称：北京哲想软件有限公司 北京哲想软件官方网站：cogitosoft.com 北京哲想软件微信公众平台账号：cogitosoftware 北京哲想软件微博：哲想软件 北京哲想软件邮箱：[email protected] 联系方式：+86（010）68421378 俞先生： 微信：18610247936 QQ：368531638 |
【本文地址】
今日新闻 |
推荐新闻 |