ASP.NET MVC中的Kendo UI Grid分页问题

Question

In my Kendo UI Grid, I set the Page Size attribute to three - PageSize(3):

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.Discount>()
    .Name("discountgrid")
    .Columns(c=>
    {
        c.Bound(d => d.Id);
        c.Bound(d => d.Category);
        c.Bound(d => d.Percentage);
        c.Bound(d => d.Merchandise);
        c.Command(cm => { cm.Edit(); cm.Destroy(); });
    })
    .Pageable()
    .ToolBar(toolbar => toolbar.Create())
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(3)
        .ServerOperation(false)
        .Model(model => model.Id(d => d.Id))
        .Create(update => update.Action("EditingInline_Create", "Grid"))
        .Update(update => update.Action("EditingInline_Update", "Grid"))
        .Destroy(update => update.Action("EditingInline_Destroy", "Grid"))
    )
)

After adding the first three rows, when I insert the 4th record, the first record disappears (as expected) - but I don't see an option to go to the second page (Page 2) in the grid footer.

Why is that? What am I missing?

Answer 1

我认为您缺少向网格提供READ操作的功能。

Answer 2

You have to specify the Read action on the DataSource and add the RequestEnd event. You can place your DataSource read method inside this event. The event type parameter on the RequestEnd event such as "update","create","destroy" can then be used to determine which operation is complete and reload the data on the grid.

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.Discount>()
.Name("discountgrid")
.Columns(c=>
{
    c.Bound(d => d.Id);
    c.Bound(d => d.Category);
    c.Bound(d => d.Percentage);
    c.Bound(d => d.Merchandise);
    c.Command(cm => { cm.Edit(); cm.Destroy(); });
})
.Pageable()
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.InCell))
.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(3)
    .ServerOperation(false)
    .Events(e => { e.RequestEnd("onRequestEnd"); })//onRequestEnd is the javascript fxn
    .Model(model => model.Id(d => d.Id))
    .Read(read => read.Action("EditingInline_Read","Grid"))
    .Create(update => update.Action("EditingInline_Create", "Grid"))
    .Update(update => update.Action("EditingInline_Update", "Grid"))
    .Destroy(update => update.Action("EditingInline_Destroy", "Grid"))
))


<script type="text/javascript">

function onRequestEnd(e) {
    if (e.type === "create" || e.type === "update" || e.type === "destroy") {
        e.sender.read();
    }
}

</script>

If you need further information, please read this link

Answer 3

尝试将Read()操作添加到网格中，并且出于测试目的，可能设置ServerOperation(true)