I am showing some data in modal pop-up using BootStrap .Basically I am using for each loop for displaying Data. So I would like to know, How To apply paging in these scenario using PagedList asp net core mvc or any other plugin in pop-up modal.
thank you
Answered by:- jaya
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 or you can use LazZiya Taghelper
Add this paging Nuget Package, by navigating to Tools -> Nuget Package Manager -> Manage Nuget Packages -> Search for "LazZiya.TagHelpers"
Create the Razor Code as below sample HTML
@addTagHelper *, LazZiya.TagHelpers
@model PagedResult<Employee>
<br/>
<table cellpadding="0" cellspacing="0" class="table table-bordered table-condensed">
<tr>
<th>Emp Id</th>
<th>First Name</th>
<th>Last Name</th>
<th>Job Title</th>
</tr>
@foreach (var products in Model.Results)
{
<tr>
<td>@products.EmpID</td>
<td>@products.FirstName</td>
<td>@products.LastName</td>
<td>@products.JobTitle</td>
</tr>
}
</table>
<paging page-no="@Model.CurrentPage"
page-size="@Model.PageSize"
total-records="@(Model.RowCount)">
</paging>
If you don't like the above solution, you can also use jQuery based solution, by fetching results in JSON and then using below jQuery plugin.
http://pagination.js.org/ (jQuery based paging)
https://www.nuget.org/packages/X.PagedList.Mvc.Core/ (Another plugin for Paging for .NET Core)
Creating GridView in ASP.NET Core MVC with Paging (Detailed article on Paging in GridView)
Answered by:- Sam
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.
Subscribe to our weekly Newsletter & Keep getting latest article/questions in your inbox weekly