PagedList in BootStrap pop-up Modal using Asp.Net CORE MVC

You can show data in Bootstrap pop-up modal like you do basically in all Razor pages in MVC.

To implement paging (IPagedList) inside pop-up modal, You would require to use jQuery plugin with it.

Create the Razor Code as below sample HTML

@using PagedList.Mvc;
@model PagedList.IPagedList<Project.Web.Models.Details>
@{
    var pCount = Model.PageCount;
}

<div class="table-responsive">
    <table class="table table-bordered table-hover">
        <thead>
            <tr>
                <th>Provider</th>
                <th>Expiring Date</th>
                <th>Bandwidth</th>
                <th>Company Name</th>
                <th>Address Name</th>
               
            </tr>

        </thead>
        <tbody>
            @foreach (var M in Model)
            {
            <tr>
                <td>@M.Provider</td>
                <td>@M.Contract.Value.ToShortDateString()</td>
                <td>@M.Internet</td>
                <td>@M.CompanyName</td>
                <td>@M.AddressName</td>
            </tr>   
            }
        </tbody>
    </table>
</div>

<div class="pagination-container">
    <ul class="pagination">
        @for (var i = 1; i <= pCount; i++)
        {
            if (i == Model.PageNumber)
            {
                <li class="active"><a>@i</a></li>
            }
            else
            {
               <!--Loading next page using jQuery Ajax in Pop-Up Modal -->
                <li><a href="javascript:void(0)" class="GetAjaxCall" data-id="@i" data-action="AgreementExpiring">@i</a></li>
            }
        }

    </ul>
</div>

jQuery code to load new data in pop-up modal should be inside Main View(View from which modal is opened.)

 $(document).on('click', ".GetAjaxCall", function () {
              var id = $(this).attr('data-id');
              var action = $(this).attr('data-action');

              $.get('/Controller/' + action + "?page=" + id, function (data) {
                 
                 
                  $("#ModalPopUpBody").html(data);
                
              });

          });

Above solution works, but when there will be lots of pages, it shows all the pages number like 1 to 50 continuously so to make it like 1,2,3....10 we can use any of these jQuery plugin 

https://esimakin.github.io/twbs-pagination/#examples

http://pagination.js.org/

The above plugins will help you convert pages list "1 2 3 4 5 6 7 8 9 10" to "1 2 3....10", will be helpful when there are lots pages like more than 20.

If the above solution didn't worked for you, please check this article 

https://qawithexperts.com/article/asp.net/paging-in-bootstrap-pop-up-modal-in-aspnet-mvc/182

This is MVC solution but should work with ASP.NET Core also.