Paging and Sorting in ASP.NET MVC 4
In this blog, I will explain the process of paging and
sorting in ASP.NET MVC 4 step by step. The database is uploaded in this article.
Before read this article, please read Paging in ASP.NET MVC
Let's do it with practically.
Open Visual Studio go to
File->New->Project with name "mvcpaging"
Click on OK button.
Select empty template and for paging, install PagedList.mvc
in your project but in my project, it is already installed.
If PagedList.mvc is not installed in your project, install it, as it is needed to see previous articles.
If PagedList.mvc is not installed in your project, install it, as it is needed to see previous articles.
Hence, there is no need to install it again.
Its reference is added in controller.
Add student class(student.cs).
Add a controller StudentInfo code.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using mvcpaging.Models;
using System.Data;
using PagedList;
namespace mvcpaging.Controllers
{
public class StudentInfoController : Controller
{
[HttpGet]
public ActionResult Index(string sortOrder, string CurrentSort, int? page)
{
int pageSize = 5;
int pageIndex = 1;
pageIndex = page.HasValue ? Convert.ToInt32(page) : 1;
ViewBag.CurrentSort = sortOrder;
sortOrder = String.IsNullOrEmpty(sortOrder) ? "Id" : sortOrder;
IPagedList<student> stu = null;
BL buisnessLogic = new BL();
DataTable dt = new DataTable();
student objStudent = new student();
List<student> objStudentList = new List<student>();
objStudentList = buisnessLogic.studentListBind();
objStudent.std = objStudentList;
switch (sortOrder)
{
case "Id":
if (sortOrder.Equals(CurrentSort))
stu = objStudentList.OrderByDescending
(m => m.Id).ToPagedList(pageIndex, pageSize);
else
stu = objStudentList.OrderBy
(m => m.Id).ToPagedList(pageIndex, pageSize);
break;
case "Name":
if (sortOrder.Equals(CurrentSort))
stu = objStudentList.OrderByDescending
(m => m.Name).ToPagedList(pageIndex, pageSize);
else
stu = objStudentList.OrderBy
(m => m.Name).ToPagedList(pageIndex, pageSize);
break;
case "Mother Name":
if (sortOrder.Equals(CurrentSort))
stu = objStudentList.OrderByDescending
(m => m.Mothername).ToPagedList(pageIndex, pageSize);
else
stu = objStudentList.OrderBy
(m => m.Mothername).ToPagedList(pageIndex, pageSize);
break;
case "Father Name":
if (sortOrder.Equals(CurrentSort))
stu = objStudentList.OrderByDescending
(m => m.Fathername).ToPagedList(pageIndex, pageSize);
else
stu = objStudentList.OrderBy
(m => m.Fathername).ToPagedList(pageIndex, pageSize);
break;
case "Age":
if (sortOrder.Equals(CurrentSort))
stu = objStudentList.OrderByDescending
(m => m.Age).ToPagedList(pageIndex, pageSize);
else
stu = objStudentList.OrderBy
(m => m.Age).ToPagedList(pageIndex, pageSize);
break;
case "Country":
if (sortOrder.Equals(CurrentSort))
stu = objStudentList.OrderByDescending
(m => m.Country).ToPagedList(pageIndex, pageSize);
else
stu = objStudentList.OrderBy
(m => m.Country).ToPagedList(pageIndex, pageSize);
break;
case "State":
if (sortOrder.Equals(CurrentSort))
stu = objStudentList.OrderByDescending
(m => m.State).ToPagedList(pageIndex, pageSize);
else
stu = objStudentList.OrderBy
(m => m.State).ToPagedList(pageIndex, pageSize);
break;
case "Nationality":
if (sortOrder.Equals(CurrentSort))
stu = objStudentList.OrderByDescending
(m => m.Nationality).ToPagedList(pageIndex, pageSize);
else
stu = objStudentList.OrderBy
(m => m.Nationality).ToPagedList(pageIndex, pageSize);
break;
}
return View(stu);
}
}
}
Business logic class(BL.cs)
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data;
using System.Data.SqlClient;
namespace mvcpaging.Models
{
public class BL
{
SqlHelper sql1 = new SqlHelper();
public List<student> studentListBind() {
DataTable dt = new DataTable();
SqlParameter[] GetBalance_Parm = new SqlParameter[]
{
};
DataSet _DS = SqlHelper.GetDataSet(SqlHelper.mainConnectionString, CommandType.StoredProcedure, "[GetStdInfo]", GetBalance_Parm);
List<student> lst = new List<student>();
if (_DS.Tables[0].Rows.Count > 0)
{
foreach (DataRow item in _DS.Tables[0].Rows)
{
lst.Add(new student
{
Id=Convert.ToInt32(item["id"]),
Name =Convert.ToString(item["name"]),
Fathername = Convert.ToString(item["fathername"]),
Mothername = Convert.ToString(item["mothername"]),
Age = Convert.ToInt32(item["age"]),
Country = Convert.ToString(item["country"]),
State = Convert.ToString(item["state"]),
Nationality = Convert.ToString(item["nationality"])
});
}
}
return lst;
}
}
}
CSS for paging:
<style>
.ul.pagination
{
display: inline-block;
padding: 0;
margin: 0;
}
ul.pagination li
{
display: inline;
}
ul.pagination li a
{
color: black;
float: left;
padding: 8px 16px;
text-decoration: none;
transition: background-color .3s;
}
ul.pagination li a.active
{
background-color: #4CAF50;
color: white;
}
ul.pagination li a:hover:not(.active)
{
background-color: #ddd;
}
</style>
View:
View:
@using (Html.BeginForm())
{
<center>
<h2>Student Details</h2>
<div style="border:1px solid red; margin-left:25%; margin-right:20%">
<table style="width:100%" border="1">
<tr>
<th style="/*/*/*width:15%; text-align:left*/*/*/"> @Html.ActionLink("Student ID", "Index",
new { sortOrder = "Id", CurrentSort = ViewBag.CurrentSort })</th>
<th style="width:10%; text-align:left">@Html.ActionLink("Name", "Index",
new { sortOrder = "Name", CurrentSort = ViewBag.CurrentSort })</th>
<th style="width:15%; text-align:left">@Html.ActionLink("Father Name", "Index",
new { sortOrder = "Father Name", CurrentSort = ViewBag.CurrentSort })</th>
<th style="width:15%; text-align:left">@Html.ActionLink("Mother Name", "Index",
new { sortOrder = "Mother Name", CurrentSort = ViewBag.CurrentSort })</th>
<th style="width:5%; text-align:left">@Html.ActionLink("Age", "Index",
new { sortOrder = "Age", CurrentSort = ViewBag.CurrentSort })</th>
<th style="width:15%; text-align:left">@Html.ActionLink("Country", "Index",
new { sortOrder = "Country", CurrentSort = ViewBag.CurrentSort })</th>
<th style="width:15%; text-align:left">@Html.ActionLink("State", "Index",
new { sortOrder = "State", CurrentSort = ViewBag.CurrentSort })</th>
<th style="width:15%; text-align:left">@Html.ActionLink("Nationality", "Index",
new { sortOrder = "Nationality", CurrentSort = ViewBag.CurrentSort })</th>
</tr>
@for (int i = 0; i < Model.Count; i++)
{
<tr style="border:1px solid red">
<td>@Model[i].Id</td>
<td>@Model[i].Name</td>
<td>@Model[i].Fathername</td>
<td>@Model[i].Mothername</td>
<td>@Model[i].Age</td>
<td>@Model[i].Country</td>
<td>@Model[i].State</td>
<td>@Model[i].Nationality</td>
</tr>
}
</table>
</div>
</center>
<div id="container" style="margin-left: 20px">
<p></p>
<p></p>
<div class="pagination" style="margin-left: 400px">
Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber)
of @Model.PageCount @Html.PagedListPager(Model, page => Url.Action("Index", new { page }))
</div>
</div>
}
After executing it, first we are talking about paging,
followed by sorting. The default first page opens, which is given below and can
be viewed via Student Id.
Now, after clicking on the second page, its data is showing
here.
Now, click on 4th page and it's data is shown here.
Now, you have seen that paging is working fine.
Sorting:
Now, we will see
sorting here. When the project is executed, then you can see student ID.
After clicking on Student ID header, it is sorted in
descending order, which you can see.
For Name sorting, you can see the name.
After clicking on Name header, it's sorted, which you can
see.
Here, sorting for Age is given below.
After clicking on Age header, it's sorted, which you can see below.
Conclusion: Here, as you can see, every thing is working fine. In this article, we have learned
how to use paging and sorting in ASP.NET MVC 4.
Leave a Comment