如何在Kendo UI中更改Grid页面大小的默认值?

5

我是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?

1个回答

14
通常你会使用 PageSize() 函数来设置分页大小,它可以在你的 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();

你的回答让我改变了页面的值,但它没有将20设置为默认值。在框中的值是20,但只显示了5个项目。 - MSH
4
你尝试过明确设置数据源并使用 .DataSource(ds => ds.Server().PageSize(20)) 来查看是否有所不同吗? - Rion Williams
通过默认的JSON初始化程序进行初始化怎么样:var grid = $("#grid").kendoGrid({ ... }); ……这个目的不是有一个参数吗? - Jeach

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接