ASP.NET MVC 中的剑道 UI 网格分页问题

本文关键字:UI 网格 分页 问题 NET MVC ASP | 更新日期: 2023-09-27 18:34:14

在我的剑道UI网格中,我将页面大小属性设置为三 - 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"))
    )
)

添加前三行后,当我插入第 4 条记录时,第一条记录消失了(如预期的那样( - 但我在网格页脚中看不到转到第二页(第 2 页(的选项。

这是为什么呢?我错过了什么?

ASP.NET MVC 中的剑道 UI 网格分页问题

我认为您缺少向网格提供读取操作。

您必须在数据源上指定读取操作并添加 RequestEnd 事件。可以将数据源读取方法放在此事件中。然后,可以使用 RequestEnd 事件上的事件类型参数(如"update"、"create"、"destroy"(来确定哪个操作已完成,并在网格上重新加载数据。

@(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>

如果您需要更多信息,请阅读此链接

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