Please help me out in doing server side pagination using kendo grid
Below is my index.cshtml
@using Kendo.Mvc.UI
<script src="../../js/jquery-1.8.3.min.js" type="text/javascript"></script>
@*<script src="../../js/jquery-1.7.1.min.js" type="text/javascript"></script>*@
@*<script src="../../js/jquery.min.js" type="text/javascript"></script>*@
<link href="../../styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<script src="../../js/kendo.all.min.js" type="text/javascript"></script>
<link href="../../styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<script src="../../js/kendo.aspnetmvc.min.js" type="text/javascript"></script>
@model IEnumerable<KendoGrid.Controllers.Product>
@(Html.Kendo().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.ID).Groupable(false);
columns.Bound(p => p.Name);
columns.Bound(p => p.Address);
columns.Command(command => command.Destroy()).Width(110);
})
.ToolBar(toolbar => {
toolbar.Create();
toolbar.Save();
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Sortable(sortable => sortable.SortMode(GridSortMode.MultipleColumn))
.Scrollable()
.Navigatable()
.Filterable()
.Pageable()
.Groupable()
.Resizable(resize => resize.Columns(true))
.Reorderable(reorder => reorder.Columns(true))
.Selectable()
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.ServerOperation(true)
.Events(events => events.Error("error_handler"))
.Model(model => model.Id(p => p.ID))
.Create("Editing_Create", "Home")
.Read("Editing_Read", "Home")
.Update("Editing_Update", "Home")
.Destroy("Editing_Destroy", "Home")
)
)
And below is my HomeController.cs
using System.Collections.Generic;
using System.Web.Mvc;
using Kendo.Mvc.Extensions;
using Kendo.Mvc.UI;
using System;
using System.Linq;
using System.Web;
namespace KendoGrid.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
//return View(GetProducts());
return View();
}
public ActionResult Remote_Data()
{
return View("AjaxBinding");
}
//public ActionResult Products_Read([DataSourceRequest] DataSourceRequest request)
//{
// return Json(GetProducts().ToDataSourceResult(request));
//}
public ActionResult Editing()
{
return View();
}
public ActionResult Editing_Read([DataSourceRequest] DataSourceRequest request)
{
return Json(SessionProductRepository.All().ToDataSourceResult(request));
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Editing_Create([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<Product> products)
{
var results = new List<Product>();
if (products != null && ModelState.IsValid)
{
foreach (var product in products)
{
SessionProductRepository.Insert(product);
results.Add(product);
}
}
return Json(results.ToDataSourceResult(request, ModelState));
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Editing_Update([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<Product> products)
{
if (products != null && ModelState.IsValid)
{
foreach (var product in products)
{
var target = SessionProductRepository.One(p => p.ID == product.ID);
if (target != null)
{
target.Name = product.Name;
target.Address = product.Address;
SessionProductRepository.Update(target);
}
}
}
return Json(ModelState.ToDataSourceResult());
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Editing_Destroy([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<Product> products)
{
if (products.Any())
{
foreach (var product in products)
{
SessionProductRepository.Delete(product);
}
}
return Json(ModelState.ToDataSourceResult());
}
public ActionResult Products(int pageSize, int skip)
{
var products = SessionProductRepository.All();
// Get the total number of records - needed for paging
var total = products.Count();
// Page the data
var data = products.Skip(skip).Take(pageSize).ToList();
// Return as JSON - the Kendo Grid will use the response
return Json(new { total = total, data = data });
}
//private static IEnumerable<Product> GetProducts()
//{
// List<Product> products = new System.Collections.Generic.List<Product>();
// products.Add(new Product { ID = 1, Name = "Test-1", Address = "Address-1" });
// products.Add(new Product { ID = 2, Name = "Test-2", Address = "Address-2" });
// products.Add(new Product { ID = 3, Name = "Test-3", Address = "Address-3" });
// products.Add(new Product { ID = 4, Name = "Test-4", Address = "Address-4" });
// return products;
//}
}
public class Product
{
public int ID { get; set; }
public string Name { get; set; }
public string Address { get; set; }
}
public static class SessionProductRepository
{
public static IList<Product> All()
{
IList<Product> result = (IList<Product>)HttpContext.Current.Session["Products"];
if (result == null)
{
List<Product> products = new System.Collections.Generic.List<Product>();
products.Add(new Product { ID = 1, Name = "Test-1", Address = "Address-1" });
products.Add(new Product { ID = 2, Name = "Test-2", Address = "Address-2" });
products.Add(new Product { ID = 3, Name = "Test-3", Address = "Address-3" });
products.Add(new Product { ID = 4, Name = "Test-4", Address = "Address-4" });
products.Add(new Product { ID = 5, Name = "Test-5", Address = "Address-5" });
products.Add(new Product { ID = 6, Name = "Test-6", Address = "Address-6" });
products.Add(new Product { ID = 7, Name = "Test-7", Address = "Address-7" });
products.Add(new Product { ID = 8, Name = "Test-8", Address = "Address-8" });
products.Add(new Product { ID = 9, Name = "Test-9", Address = "Address-9" });
products.Add(new Product { ID = 10, Name = "Test-10", Address = "Address-10" });
products.Add(new Product { ID = 11, Name = "Test-11", Address = "Address-11" });
products.Add(new Product { ID = 12, Name = "Test-12", Address = "Address-12" });
products.Add(new Product { ID = 13, Name = "Test-13", Address = "Address-13" });
HttpContext.Current.Session["Products"] = result = products;
}
return result;
}
public static Product One(Func<Product, bool> predicate)
{
return All().Where(predicate).FirstOrDefault();
}
public static void Insert(Product product)
{
product.ID = All().OrderByDescending(p => p.ID).First().ID + 1;
All().Insert(0, product);
}
public static void Update(Product product)
{
Product target = One(p => p.ID == product.ID);
if (target != null)
{
target.Name = product.Name;
target.Address = product.Address;
}
}
public static void Delete(Product product)
{
Product target = One(p => p.ID == product.ID);
if (target != null)
{
All().Remove(target);
}
}
}
}
Below is my index.cshtml
@using Kendo.Mvc.UI
<script src="../../js/jquery-1.8.3.min.js" type="text/javascript"></script>
@*<script src="../../js/jquery-1.7.1.min.js" type="text/javascript"></script>*@
@*<script src="../../js/jquery.min.js" type="text/javascript"></script>*@
<link href="../../styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<script src="../../js/kendo.all.min.js" type="text/javascript"></script>
<link href="../../styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<script src="../../js/kendo.aspnetmvc.min.js" type="text/javascript"></script>
@model IEnumerable<KendoGrid.Controllers.Product>
@(Html.Kendo().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.ID).Groupable(false);
columns.Bound(p => p.Name);
columns.Bound(p => p.Address);
columns.Command(command => command.Destroy()).Width(110);
})
.ToolBar(toolbar => {
toolbar.Create();
toolbar.Save();
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Sortable(sortable => sortable.SortMode(GridSortMode.MultipleColumn))
.Scrollable()
.Navigatable()
.Filterable()
.Pageable()
.Groupable()
.Resizable(resize => resize.Columns(true))
.Reorderable(reorder => reorder.Columns(true))
.Selectable()
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.ServerOperation(true)
.Events(events => events.Error("error_handler"))
.Model(model => model.Id(p => p.ID))
.Create("Editing_Create", "Home")
.Read("Editing_Read", "Home")
.Update("Editing_Update", "Home")
.Destroy("Editing_Destroy", "Home")
)
)
And below is my HomeController.cs
using System.Collections.Generic;
using System.Web.Mvc;
using Kendo.Mvc.Extensions;
using Kendo.Mvc.UI;
using System;
using System.Linq;
using System.Web;
namespace KendoGrid.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
//return View(GetProducts());
return View();
}
public ActionResult Remote_Data()
{
return View("AjaxBinding");
}
//public ActionResult Products_Read([DataSourceRequest] DataSourceRequest request)
//{
// return Json(GetProducts().ToDataSourceResult(request));
//}
public ActionResult Editing()
{
return View();
}
public ActionResult Editing_Read([DataSourceRequest] DataSourceRequest request)
{
return Json(SessionProductRepository.All().ToDataSourceResult(request));
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Editing_Create([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<Product> products)
{
var results = new List<Product>();
if (products != null && ModelState.IsValid)
{
foreach (var product in products)
{
SessionProductRepository.Insert(product);
results.Add(product);
}
}
return Json(results.ToDataSourceResult(request, ModelState));
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Editing_Update([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<Product> products)
{
if (products != null && ModelState.IsValid)
{
foreach (var product in products)
{
var target = SessionProductRepository.One(p => p.ID == product.ID);
if (target != null)
{
target.Name = product.Name;
target.Address = product.Address;
SessionProductRepository.Update(target);
}
}
}
return Json(ModelState.ToDataSourceResult());
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Editing_Destroy([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<Product> products)
{
if (products.Any())
{
foreach (var product in products)
{
SessionProductRepository.Delete(product);
}
}
return Json(ModelState.ToDataSourceResult());
}
public ActionResult Products(int pageSize, int skip)
{
var products = SessionProductRepository.All();
// Get the total number of records - needed for paging
var total = products.Count();
// Page the data
var data = products.Skip(skip).Take(pageSize).ToList();
// Return as JSON - the Kendo Grid will use the response
return Json(new { total = total, data = data });
}
//private static IEnumerable<Product> GetProducts()
//{
// List<Product> products = new System.Collections.Generic.List<Product>();
// products.Add(new Product { ID = 1, Name = "Test-1", Address = "Address-1" });
// products.Add(new Product { ID = 2, Name = "Test-2", Address = "Address-2" });
// products.Add(new Product { ID = 3, Name = "Test-3", Address = "Address-3" });
// products.Add(new Product { ID = 4, Name = "Test-4", Address = "Address-4" });
// return products;
//}
}
public class Product
{
public int ID { get; set; }
public string Name { get; set; }
public string Address { get; set; }
}
public static class SessionProductRepository
{
public static IList<Product> All()
{
IList<Product> result = (IList<Product>)HttpContext.Current.Session["Products"];
if (result == null)
{
List<Product> products = new System.Collections.Generic.List<Product>();
products.Add(new Product { ID = 1, Name = "Test-1", Address = "Address-1" });
products.Add(new Product { ID = 2, Name = "Test-2", Address = "Address-2" });
products.Add(new Product { ID = 3, Name = "Test-3", Address = "Address-3" });
products.Add(new Product { ID = 4, Name = "Test-4", Address = "Address-4" });
products.Add(new Product { ID = 5, Name = "Test-5", Address = "Address-5" });
products.Add(new Product { ID = 6, Name = "Test-6", Address = "Address-6" });
products.Add(new Product { ID = 7, Name = "Test-7", Address = "Address-7" });
products.Add(new Product { ID = 8, Name = "Test-8", Address = "Address-8" });
products.Add(new Product { ID = 9, Name = "Test-9", Address = "Address-9" });
products.Add(new Product { ID = 10, Name = "Test-10", Address = "Address-10" });
products.Add(new Product { ID = 11, Name = "Test-11", Address = "Address-11" });
products.Add(new Product { ID = 12, Name = "Test-12", Address = "Address-12" });
products.Add(new Product { ID = 13, Name = "Test-13", Address = "Address-13" });
HttpContext.Current.Session["Products"] = result = products;
}
return result;
}
public static Product One(Func<Product, bool> predicate)
{
return All().Where(predicate).FirstOrDefault();
}
public static void Insert(Product product)
{
product.ID = All().OrderByDescending(p => p.ID).First().ID + 1;
All().Insert(0, product);
}
public static void Update(Product product)
{
Product target = One(p => p.ID == product.ID);
if (target != null)
{
target.Name = product.Name;
target.Address = product.Address;
}
}
public static void Delete(Product product)
{
Product target = One(p => p.ID == product.ID);
if (target != null)
{
All().Remove(target);
}
}
}
}