kendo ui grid完成服务器端分页和设置总计数

时间:2016-12-26 09:12:45

标签: asp.net-mvc kendo-ui kendo-grid

我正在使用带有服务器端分页的kendo网格。我在数据库端本身进行数据的排序和获取,这只给出了页数大小的记录。我还可以从后端本身获得总记录数。我只是想将这些数据绑定到kendo网格,并根据我返回的计数显示页码。

即。对于每个下一页请求,我只返回pagesize(例如15)记录总数的记录数。下面是我的kendo网格代码。请帮我绑定这些记录并根据总数显示页码。

@(Html.Kendo().Grid(Model.InvoiceList)
.Name("InvoiceGrid")
.Columns(columns =>
{
columns.Bound(p => p.CompanyName).Title("Company Name").Width(80);
columns.Bound(p => p.Account).Title("Account").Width(60);
columns.Bound(p => p.MerchantNumber).Title("Merchant No.").Width(60);
columns.Bound(p => p.InvoiceAmount).Title("Invoice Amount").Width(60);
columns.Bound(p => p.ReferralPercentage).Title("Referral %").Width(60);
columns.Bound(p => p.ReferralCommission).Title("Referral Com.").Width(60);
columns.Bound(p => p.DeveloperPercentage).Title("Developer %").Width(60);
columns.Bound(p => p.DeveloperCommission).Title("Developer Com.").Width(60);
})
.Pageable(
 )
.Sortable()
.Filterable(filterable => filterable
    .Extra(false)
    )
.DataSource(dataSource => dataSource
 .Ajax()
    .Batch(false)
    .PageSize(15)
      .ServerOperation(true)
      .Read(read => read.Action("Index", "Invoice")
      ).Total(Model.count)
 )
 )

我用来获取记录的服务器端代码如下所示。

public async Task<ActionResult> IndexAsync(int pageNo=0,int numberOfRecord=15)
    {

        //InvoicePaging has invoice list of 15 records and count = 400
        InvoicePaging ip = await InvoiceDAL<FileRecord>.getAllInvoices("SProcGetInvoiceList", pageNo, numberOfRecord);
        return View("InvoiceList",ip);
    }

发票分页类 -

public class InvoicePaging
{
    [JsonProperty(PropertyName = "InvoiceList")]
    public List<Invoice> InvoiceList { get; set; }

    [JsonProperty(PropertyName = "count")]
    public int count { get; set; }
}

1 个答案:

答案 0 :(得分:0)

在搜索问题的解决方案之后,我得到了以下代码。

@(Html.Kendo().Grid<Commission.Vault.Models.Invoice>()
.Name("InvoiceGrid")
.Columns(columns =>
{
columns.Bound(p => p.CompanyName).Title("Company Name").Width(80);
columns.Bound(p => p.Account).Title("Account").Width(60);
columns.Bound(p => p.MerchantNumber).Title("Merchant No.").Width(60);
columns.Bound(p => p.InvoiceAmount).Title("Invoice Amount").Width(60);
columns.Bound(p => p.ReferralPercentage).Title("Referral %").Width(60);
columns.Bound(p => p.ReferralCommission).Title("Referral Com.").Width(60);
columns.Bound(p => p.DeveloperPercentage).Title("Developer %").Width(60);
columns.Bound(p => p.DeveloperCommission).Title("Developer Com.").Width(60);
})

.EnableCustomBinding(true)
.BindTo(Model.InvoiceList)
.Pageable(
 )
.Sortable()
.Filterable(filterable => filterable
    .Extra(false)
    )
.DataSource(dataSource => dataSource.Server().Total(Model.count).PageSize(15)
 )
 )

在Asp.net中代码背后的代码是

public async Task<ActionResult> IndexAsync([DataSourceRequest(Prefix = "InvoiceGrid")] DataSourceRequest request)
    {
        List<Invoice> il = new List<Invoice>();
        int pageNo = request.Page-1,numberOfRecord=15;
        InvoicePaging ip = await InvoiceDAL<FileRecord>.getAllInvoices("SProcGetInvoiceList", pageNo, numberOfRecord);
        return View("InvoiceList",ip);
    }

唯一的问题是我总是将pageSize设为0.其他一切都运行良好。