Csharp: Paging Sorting Searching In ASP. net mvc 5, csharpmvc
Http://www.c-sharpcorner.com/UploadFile/0c1bb2/sorting-paging-searching-in-Asp-Net-mvc-5/
Https://dzone.com/articles/table-sorting-pagination
Https://datatables.net/
Index. cshtm:
@{ ViewBag.Title = "Paging Sorting Searching In ASP.NET MVC 5";}<script src="~/Scripts/jquery-1.10.2.min.js"></script><link rel="stylesheet" type="text/css" href="~/css/jquery.dataTables.min.css"><script type="text/javascript" language="javascript" src="~/Scripts/jquery.dataTables.min.zh.js" charset="utf-8"></script><script> $(document).ready(function () { //Call EmpDetails jsonResult Method http://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css $.getJSON("Home/EmpDetails", function (json) { var tr; //Append each row to html table for (var i = 0; i < json.length; i++) { tr = $('<tr/>'); tr.append("<td>" + json[i].Id + "</td>"); tr.append("<td>" + json[i].Name + "</td>"); tr.append("<td>" + json[i].City + "</td>"); tr.append("<td>" + json[i].Address + "</td>"); $('table').append(tr); } $('#EmpInfo').DataTable(); }); });</script>
_ Layout. cshtml:
<! DOCTYPE html>
HomeController. cs:
Using PagingSoringInMVC. models; using System. collections. generic; using System. linq; using System. web; using System. web. mvc; namespace PagingSoringInMVC. controllers {// <summary> //// </summary> public class HomeController: Controller {// GET: Home [HttpGet] public ActionResult Index () {return View ();} [HttpGet] public JsonResult EmpDetails () {// Creating List <Employee> ObjEmp = new List <Employee> () {// Adding records to list new Employee {Id = 1, Name = "Vithal Wadje", City = "Latur", Address = "Kabansangvi "}, new Employee {Id = 2, Name = "Sudhir Wadje", City = "Mumbai", Address = "Kurla"}, new Employee {Id = 3, name = "Dinesh Beniwal", City = "New Delhi", Address = "Noida"}, new Employee {Id = 4, Name = "Dhananjay Kumar ", city = "New Delhi", Address = "Delhi"}, new Employee {Id = 5, Name = "Jitendra Gund", City = "Pune ", address = "Pune"}, new Employee {Id = 6, Name = "Anil Kumar", City = "chandigarh", Address = "chandigarh "}, new Employee {Id = 7, Name = "Ramesh", City = "Mumbai", Address = "Kurla"}, new Employee {Id = 8, Name = "tu Yi ", city = "Beijing", Address = "Dongcheng District xuancheng Road"}, new Employee {Id = 9, Name = "", City = "Beijing ", address = "West chang'an Street, Xicheng district"}, new Employee {Id = 10, Name = "Yellow seven", City = "Beijing", Address = "Changping University City Road "}, new Employee {Id = 11, Name = "Sun ba", City = "Shanghai", Address = "yan'an West Road, Xujiahui district"}, new Employee {Id = 12, name = "Sudhir Wadje", City = "Mumbai", Address = "Kurla"}, new Employee {Id = 13, Name = "Dinesh Beniwal ", city = "New Delhi", Address = "Noida"}, new Employee {Id = 14, Name = "Dhananjay Kumar", City = "New Delhi ", address = "Delhi"}, new Employee {Id = 15, Name = "Jitendra Gund", City = "Pune", Address = "Pune "}, new Employee {Id = 16, Name = "Anil Kumar", City = "chandigarh", Address = "chandigarh"}, new Employee {Id = 17, Name = "Ramesh ", city = "Mumbai", Address = "Kurla"}, new Employee {Id = 18, Name = "Zhao Er", City = "Shenzhen ", address = "YanHe North Road, Luohu District"}, new Employee {Id = 19, Name = "zhangsan", City = "Shenzhen City", Address = "South keyuan Road, Nanshan District "}, new Employee {Id = 20, Name = "", City = "Shenzhen", Address = "Houhai Avenue, Nanshan District"}, new Employee {Id = 21, name = "Vithal Wadje", City = "Latur", Address = "Kabansangvi"}, new Employee {Id = 22, Name = "Sudhir Wadje", City = "Mumbai ", address = "Kurla"}, new Employee {Id = 23, Name = "Dinesh Beniwal", City = "New Delhi", Address = "Noida "}, new Employee {Id = 24, Name = "Dhananjay Kumar", City = "New Delhi", Address = "Delhi"}, new Employee {Id = 25, name = "Jitendra Gund", City = "Pune", Address = "Pune"}, new Employee {Id = 26, Name = "Anil Kumar", City = "chandigarh ", address = "chandigarh"}, new Employee {Id = 27, Name = "Ramesh", City = "Mumbai", Address = "Kurla"}, new Employee {Id = 28, name = "Liu Jie", City = "Shenzhen City", Address = "Futian district Fuzhong Road"}, new Employee {Id = 29, Name = "Xu Da", City = "Shenzhen City ", address = "Aiguo Road, Luohu District"}, new Employee {Id = 30, Name = "Wang Wu", City = "Shenzhen City", Address = "Luohu District People's road "},}; // return Json (ObjEmp, JsonRequestBehavior. allowGet );}}}
Employee. cs:
using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;namespace PagingSoringInMVC.Models{ public class Employee { public int Id { get; set; } public string Name { get; set; } public string City { get; set; } public string Address { get; set; } }}