19 July 2016 Sudhanshu Ranjan 1.14k

Paging in MVC using C# with razor

I am going to show the most useful article for you. How to implement paging in MVC using razor with c#.

You should follow the below steps to implement the paging in MVC.

Step 1: Open Visual Studio and go to the Package Manager Console. (View-> Other Windows-> Package Manager Console)

Then you should run the following command.

PM> install-package PagedList.MVC

Once you run the following command you will see the PagedList and PagedList.Mvc dll has been added in solution references. Then you need to add namespaces in page.

Step 2:  Create a new Employee table.

Step 3: Create database connection using ADO.NET Entity Data Model (.edmx wizard). (Right click on solution-> Add-> Add New Items. Select Data -> ADO.NET Entity Data Model).

Step 4:  Add a model class EmployeeModels

 public class EmployeeModels
    {
        public int EmployeeId { get; set; }
        
        [Required]
        public string EmployeeName { get; set; }

        public string Address { get; set; }        
       
    }

Step 5: Add a new controller EmployeeController and create action ViewEmployee().

using SampleApplication.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using PagedList;
using System.Configuration;


namespace SampleApplication.Controllers
{
    public class EmployeeController : Controller
    {
        TestDatabaseEntities _db = new TestDatabaseEntities();


        public ActionResult Index()
        {
            return View();
        }

        public ActionResult ViewEmployee(int? page)
        {
            var data = (from x in _db.Employees
                        select x).OrderBy(s => s.EmployeeId).Select(x => new EmployeeModels
                        {
                            EmployeeId = x.EmployeeId,
                            EmployeeName = x.EmployeeName,
                            Address = x.Address

                        });
            int pageSize = 5;
            int pageNumber = (page ?? 1);
            return View(data.ToPagedList(pageNumber, pageSize));            
        }
    }
}

In above code, we are fetching the Employee table records into list and defined the page size.

Step 6: Create a View at respective action and add following code.

@using PagedList.Mvc
@model PagedList.IPagedList<SampleApplication.Models.EmployeeModels>
@{
    ViewBag.Title = "View Employee";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>View Employee</h2>


<div class="outer-grid">
    <div class="row header-grid">
        <div class="col">Employee Id</div>
        <div class="col">Employee Name</div>
        <div class="col">Address</div>
    </div>
    @foreach (var item in Model)
    {
        <div class="row">

            <div class="col"><b>@item.EmployeeId</b></div>
            <div class="col"><b>@item.EmployeeName</b></div>
            <div class="col"><b>@item.Address</b></div>
        </div>
    }

    <br />
    <div>
        Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount
        @Html.PagedListPager(Model, page => Url.Action("ViewEmployee",
                    new { page }))
    </div>
</div>

 

Step 7: Finally you will see the below screen and this is how you can easily implement the paging in MVC.

Please write if you need any assistance while implementing paging. Thanks!!

You can share at :

About Author
Sudhanshu Kumar Ranjan | Lead Engineer at HCL Technologies | Expertise in Microsoft Technology | Author | Blogger | Programmer
Know More
Connect with him on Facebook | Google+ | LinkedIn | Twitter

Recommended Post

Leave a comment

About Dotnet Cube

It's my blog - Dotnet Cube, where you will learn and get solutions about programming, web designing and development. I started this website to share my knowledge and experience which might help someone.

You can get more details about me and my blog at About Us page.

Subscribe Newsletter

Subscribe to our monthly newsletter to get the latest industry news, Media Group updates and our current specials.

Follow On Us...

Home | About | Advertise | Copyrights | Privacy | Contact | Admin

Copyrights © 2015-2017 dotnetcube.com. All rights reserved