How can the number of pages be limited in bootstrps 5

Question

I have the following code that puts the number of pages, but the problem is that if the number of pages is many, it will expand to the end of the page. Is it possible to make the number of pages only 5 buttons?

Currently, it appears to me as the following image: enter image description here

<nav aria-label="Page navigation example">
    <ul class="pagination">
        @{
            int TotalPage = ViewBag.TotalPage;
            int PageNumber = ViewBag.PageNumber;
            if (TotalPage > 1)
            {

                for (int i = 1; i <= TotalPage; i++)
                {
                    if (PageNumber == i)
                    {
                        <li class="page-item active">
                            @Html.ActionLink(i.ToString(), "Index", "MyMission", new { area = "Task", PageNumber = i }, new { @class = "page-link" })
                        </li>

                    }
                    else
                    {
                        <li class="page-item">
                            @Html.ActionLink(i.ToString(), "Index", "MyMission", new { area = "Task", PageNumber = i }, new { @class = "page-link" })
                        </li>


                    }

                }

            }
        }
    </ul>
</nav>

Mina Shenouda · Accepted Answer · 2021-10-31T13:13:36.840

You have two options

1- you can make prev and next buttons only

@if (PageNumber  > 0)
  {
<a href="@Url.Action("Index", new { page = @PageNumber   - 1 })" 
   class="btn btn-default">
     Prev
</a>
 }
 @if (PageNumber  < TotalPage)
{
<a href="@Url.Action("Index", new { page = @PageNumber   + 1 })" 
   class="btn btn-default">
    Next 
 </a>
}

2- use pagination methods and give limit to total pageSize in action simple with this comment Paging Sample

How can the number of pages be limited in bootstrps 5

1 Answers1