如何在Kendo UI中更改網格頁面大小的默認值？

Question

我是Kendo UI的新手。我有我的代碼如下。

@(Html.Kendo().Grid<ETS.Model.CompanyList>() 
    .Name("grid") 
    .Columns(columns => 
    { 
     columns.Bound(c => c.CompanyID).Title("Name").Template(@<text>@Html.ActionLink(@item.Name, "Company", "Companies", new { @id = @item.CompanyID }, new { @style = "color:black; text-decoration: none;" })</text>); 
     columns.Bound(p => p.City).Title("Billing City"); 
     columns.Bound(p => p.SalesRep).Title("Sales Rep"); 
     columns.Bound(p => p.Phone).Title("Company Name"); 
    }) 
    .Pageable(pageable => pageable 
     .PageSizes(true) 
     .ButtonCount(5) 
     .Refresh(true) 
    ) 
    .Sortable()      
    .HtmlAttributes(new { style = "height: auto;" }) 
    .BindTo(Model.Companies) 
) 

默認情況下，網格上顯示5個項目。有什麼辦法可以將默認值更改爲20？

Answer 1

通常你會在使用PageSize() function設置你的DataSource：

@(Html.Kendo().Grid<Product>() 
    .Name("grid") 
    .DataSource(dataSource => dataSource 
     .Ajax() 
     .Read(read => read.Action("Products_Read", "Home")) 
     .PageSize(20) 
    ) 
) 

或者你可以嘗試限制可用PageSizes()只是20：

.Pageable(pageable => pageable.PageSizes(new int[] {20}) ...) 

此外，它還可以通過設置JavaScript API通過：

var grid = $("#grid").data("kendoGrid"); 
grid.dataSource.pageSize(20); 
grid.refresh();