kendo-grid - Kendo UI Grid：分页不起作用

Question

我有一张桌子：

<table id="grid">
<thead>
    <tr><th data-field="name">Name</th></tr>
</thead>
<tbody>
    <tr><td>name 1</td></tr>
    <tr><td>name 2</td></tr>
    ...
</tbody>
</table>

这就是它的初始化方式：

$('#grid').kendoGrid({
    scrollable: false,
    sortable: true,
    autoBind: true,
    columns: [ { field: 'name' } ],
    pageable: {
        buttonCount: 5,
        pageSizes: [10, 20, 50, 100, 200]
    },
    pageSize: 20
});

加载页面时，网格会显示所有元素。例如，如果有 500 个元素，则显示所有元素。页码等于 1，但未突出显示。PageSize 切换器显示“500”。当我单击 PageSize 切换器并将其更改为任何值时，分页开始工作。或者，如果我单击上一页/下一页图标，它也可以工作。怎么可能修好？

现在我用这个：

if ($grid.data("kendoGrid")) {
    $grid.data("kendoGrid").dataSource.page(1);
}

但我不确定它是否足够好。

Answer 1

pageSize 是数据源而不是 kendoGrid 的属性，尽管 Kendo 文档（截至今天）将 pageSize 作为 KendoGrid 的属性，但在他们的示例中，您将在 DataSource 中看到它。

不要与正确位置的“pageSizes”混淆。

Answer 2

尝试这个

$('#grid').kendoGrid({
    scrollable: false,
    sortable: true,
    autoBind: true,
    columns: [ { field: 'name' } ],
    pageable: {
                   refresh: true,
                   pageSizes: true
                    },
    pageSize: 20
});