ASP.Net MVC Kendo Grid的自定義分頁

Question

我有一個MVC Kendo Grid如下。 它可以正常使用默認分頁。

現在，我想做自定義分頁。 在控制器操作中，我們需要知道當前頁面索引。 它還應該設置網格的“總”計數。 [即使數據庫中有100條記錄，實際數據源一次也只有2條記錄。 因此，網格必須使用“total”屬性知道數據庫中的記錄總數。

查詢一次只能返回數據庫中的2條記錄。

我們如何使用Kendo Grid的MVC包裝器來執行此自定義服務器分頁？

@using (Html.BeginForm())
{ 

    @(Html.Kendo().Grid<KendoUIMvcSample.Models.Sample>()    
    .Name("ssgrid222")
    .Columns(columns => {
        columns.Bound(p => p.SampleDescription).Filterable(false).Width(100);
        columns.Bound(p => p.SampleCode).Filterable(false).Width(100);
        columns.Bound(p => p.SampleItems).Filterable(false).Width(100);
    })
    .AutoBind(false)
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { style = "height:430px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(2)
        .Read(read => read.Action("Orders_Read", "Sample")
)
     )
  )
}

調節器

public ActionResult Orders_Read([DataSourceRequest]DataSourceRequest request)
        {

            int currentPageNumber = request.Page;
            return Json(GetOrders().ToDataSourceResult(request));
        }

Answer 1

它在kendo站點中定義

控制器代碼

    //Paging and Sorting
    int currentPage = request.Page;
    int pageSize = request.PageSize;
    string sortDirection = "ASC";
    string sortField = "UpdatedDateTime";

    if (request.Sorts != null && request.Sorts.Count > 0)
    {
        sortField = request.Sorts[0].Member;
        sortDirection = request.Sorts[0].SortDirection.ToString();
    }

//Setting the TOTAL
var result = new DataSourceResult()
{
    Data = orders, 
    Total = total // Total number of records
};

return Json(result);

視圖

      <div class="GridSearch">

                @(Html.Kendo().Grid<MVC.Models.TransactionHistoryModel>()
    .Name("TransactionHistroyGrid")
     .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(25)
        .ServerOperation(true)
        .Read(read => read
            .Action("TransactionHistorySearch_Read", "TransactionHistoryResults")
            .Data("additionalData")
            )
     )
    .Columns(columns =>
    {
        columns.Bound(p => p.UserId).Filterable(false).Width(40).Title("Userid");
        columns.Bound(p => p.Reviewed).Template(@<text></text>).ClientTemplate("<input id='checkbox'  class='chkbx' type='checkbox' />").Filterable(false).Width(30).Title("Reviewed");
        columns.Bound(p => p.CreatedOnEnd).Format("{0:MM/dd/yyyy}").Filterable(false).Width(50).Title("Created On");
        columns.Bound(p => p.UpdatedOnEnd).Format("{0:MM/dd/yyyy}").Filterable(false).Width(50).Title("Updated On");
        columns.Bound(p => p.Comment).Filterable(false).Width(50).Title("Comment");
    })
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { style = "height:325px;" })

  )
            </div>

Answer 2

這是我們為Kendo ListView實現的自定義分頁解決方案。 經過微小的修改，它應該適用於網格。 該解決方案由自定義DataSoure對象和自定義JSonResult類組成。

自定義數據源：

public class MyDataSource
{
    public object AggregateResults { get; set; }
    public object Data { get; set; }
    public object Errors { get; set; }
    public int Total { get; set; }
}

自定義ActionResult：

public class JsonNetResult : ActionResult
{
    public Encoding ContentEncoding { get; set; }
    public string ContentType { get; set; }
    public object Data { get; set; }

    public JsonSerializerSettings SerializerSettings { get; set; }
    public Formatting Formatting { get; set; }

    public JsonNetResult()
    {
        SerializerSettings = new JsonSerializerSettings();
    }

    public override void ExecuteResult(ControllerContext context)
    {
        if (context == null)
            throw new ArgumentNullException("context");

        HttpResponseBase response = context.HttpContext.Response;

        response.ContentType = !string.IsNullOrEmpty(ContentType)
                                   ? ContentType
                                   : "application/json";

        if (ContentEncoding != null)
            response.ContentEncoding = ContentEncoding;

        if (Data != null)
        {
            var writer = new JsonTextWriter(response.Output) { Formatting = Formatting };

            JsonSerializer serializer = JsonSerializer.Create(SerializerSettings);
            serializer.Serialize(writer, Data);

            writer.Flush();
        }
    }

動作方法中的典型用法是：

public ActionResult Orders_Read([DataSourceRequest] Object request)
    {
        int count = 0;
        var ds = (DataSourceRequest)request;
        var ListOfItemsToDisplay = GetItemsWithPagingInfo
                                (
                                    MySearchParameters,
                                    ds.PageSize,
                                    ds.Page,
                                    out count
                                );
        return new JsonNetResult
                                {
                                    Formatting = Formatting.Indented,
                                    Data = new MyDataSource
                                                   {
                                                       Data = ListOfItemsToDisplay
                                                       Total = count,
                                                       AggregateResults = null,
                                                       Errors = null
                                                   }
                                    };
    }