Custom Paging for ASP.Net MVC Kendo Grid

Question

I have an MVC Kendo Grid as follows. It works great with standard paging.

Now I want to do custom paging. In the controller action, we need to know the current page index. He should also set a “general” score for the grid. [The actual data source will only have 2 records at a time, even if the database has 100 records. Thus, the grid must know the total number of records in the database using the attribute "total".]

The query should only return 2 records from the database at a time.

How can we do this custom server podcasting using the MVC shell for Kendo Grid?

@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") ) ) ) } 

Controller

 public ActionResult Orders_Read([DataSourceRequest]DataSourceRequest request) { int currentPageNumber = request.Page; return Json(GetOrders().ToDataSourceResult(request)); } 

Answer 1

It is defined on the kendo website

CONTROLLER CODE

  //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); 

VIEW

  <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

Here is the custom paging solution we implemented for Kendo ListView. With minor changes, it should work for the grid. The solution consists of a custom DataSoure object and a custom JSonResult class.

User data source:

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

Custom 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(); } } 

A Typical use in an action method:

 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 } }; }