Quantcast
Channel: ASP.NET Core
Viewing all articles
Browse latest Browse all 9386

How to create custom PagedList?

$
0
0

Hello.

I need to create a pager for my data in view and i have created it by using this tutorial : https://docs.microsoft.com/en-us/aspnet/core/data/ef-mvc/sort-filter-page?view=aspnetcore-2.0

and some changes to show page numbers.

But now my problem is :

My pages are too much and i want to show only 3 first pages number and 3 last pages number and between them show just ... .

Can some one help me in this problem?

My paginatedlist helper class :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.EntityFrameworkCore;

namespace Project.Helpers
{
    public class PaginatedList<T> : List<T>
    {
        public int PageIndex { get; private set; }
        public int TotalPages { get; private set; }

        public PaginatedList(List<T> items,int count,int pageIndex,int pageSize)
        {
            PageIndex = pageIndex;
            TotalPages = (int)Math.Ceiling(count / (double)pageSize);
            this.AddRange(items);
        }
        public bool HasPreviousPage
        {
            get
            {
                return (PageIndex > 1);
            }
        }

        public bool HasNextPage
        {
            get
            {
                return (PageIndex < TotalPages);
            }
        }

        public static async Task<PaginatedList<T>> CreateAsync(IQueryable<T> source,int pageIndex,int pageSize)
        {
            var count = await source.CountAsync();
            var items = await source.Skip((pageIndex - 1 ) * pageSize).Take(pageSize).ToListAsync();
            return new PaginatedList<T>(items,count,pageIndex,pageSize);
        }

    }
}

My action method in controller : 

public async Task<IActionResult> Index(int? id)
        {
            ViewBag.Title = "Home Page";
            var page = id ?? 1;
            var pageSize = 12;

            var items = ipss.GetProducts(); //Get products as IQueryable

            var pagedPosts = await PaginatedList<Product>.CreateAsync(items.AsNoTracking(), page, pageSize);

            return View(pagedPosts);
        }

and finally my Index.cshtml :

<nav aria-label="Page navigation" class="center-align"><ul class="pagination"><li class="@prevDisabled">
                                    @if(!String.IsNullOrEmpty(prevDisabled))
                                    {<a href="#!"><i class="ion-chevron-right"></i></a>
                                    }
                                    else
                                    {<a asp-action="Index" asp-route-id="@(Model.PageIndex - 1)" class="@prevDisabled"><i class="ion-chevron-right"></i></a>
                                    }</li>

                                @for(int i = 1; i <= totalPages; i++)
                                    {
                                        @if(i == pageIndex)
                                        {<li class="active"><a asp-action="Index" asp-route-id="@i" class="disabled">@i</a></li>
                                        }
                                        else
                                        {<li><a asp-action="Index" asp-route-id="@i">@i</a></li>
                                        }
                                    }<li class="@nextDisabled">
                                    @if(!String.IsNullOrEmpty(nextDisabled))
                                    {<a href="#!" class="@nextDisabled"><i class="ion-chevron-left"></i></a>
                                    }
                                    else
                                    {<a asp-action="Index" asp-route-id="@(Model.PageIndex + 1)" class="@nextDisabled"><i class="ion-chevron-left"></i></a>
                                    }</li></ul></nav>


Viewing all articles
Browse latest Browse all 9386

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>