Paging in ASP.NET Core MVC – Session 54

Paging in ASPNET Core - Session54

During this session, we are going to talk about Paging in ASP.NET Core MVC and implement pagination on the list. If we have a list of records that exceed a limited number of records, we are facing some difficulties when we try to display the list. In this situation, loading time is increased, and browsing the page needs long scrolling depending on the number of the records. Moreover, the user does not have any estimation regarding the number of records. To solve the mentioned issues, we can implement paging on the available lists.

What are the benefits of pagination?

  • Increase page loading time
  • Facilitate page browsing
  • Improve the appearance of the page
  • Less data transfer
  • Less scrolling
  • Provide records number estimation

Implement Paging in ASP.ENT Core MVC

There are several ways that we can implement pagination in .NET Core MVC Application. But, in this tutorial we use X.PagedList.Mvc.Core NuGet package. Hence, first, we need to install the mentioned package via NuGet Package Manager Console.

Then, we can use the package’s method and Html Helper to implement pagination. Therefore, we use ToPagedList() method to send the paged list from the Controller to the View. Through this method, we can set the current page and the number of records per page.

Now, we modify CostController and Index action method for this purpose.

As you can see, we receive the page number through the input parameter and Query String which is not a mandatory option. Then, if the page variable return null, we set 1 as a default page. Also, the number of records per page is 5.

Next, we need to modify the respective View to implement pagination. As we use X.PagedList.Mvc.Core NuGet package, we need to import the required namespace to the view. Then, we can use PagedListPager Html Helper which is related to the mentioned package. This Html Helper needs the list of the records and a function that created the required page number and their link. Moreover, this Html Helper has an Option method which is PagedListRenderOptions. Thus, we can use it for pagination modification.

We try to implement it on Cost/Index View. You can see below the changes that we should apply to the view.

Also, the full page code is available below.

Search in the Property with Null Value in EF Core

If we search in a property that has one or more records with the null value, the .NET Core throws an exception that is related to the null value. Hence, to control this expectation we should check the value of each record and if it is not null then check for the requested condition.

We have a search option for the Comment property of the Cost entity, which is nullable property. Thus we can change the previous session code same as the below code to resolve the mentioned issue.

If you need more details, watch this session video. Also, for being updated about our coming sessions, follow us on Instagram, Facebook, Telegram, or YouTube. Moreover, you can have access to the list of all sessions HERE and you can download this session source code from our GitHub.

You can download this Session Slides form HERE.

0.00 avg. rating (0% score) - 0 votes


1 2 votes
Article Rating

Inline Feedbacks
View all comments