Paging is implemented in the controller. Typically you just add a links in the view that pass the desired page number to the action. Usually a previous and next button, but maybe a list of page numbers. Optionally the page size is included.
You can use jquery.dataTables. I wrote an example, you can refer to it.
You can install jquery.datatables using NuGet, and then
reference the jquery.dataTables.min.js and
jquery.dataTables.min.css files.
I referenced these two files in the _Layout view.
Model
public class TestEntity
{
public int Id { get; set; }
public string Name { get; set; }
}
Controller
public class TestEntityController : Controller
{
public DailyMVCDemoContext db = new DailyMVCDemoContext();
public ActionResult Index()
{
return View(db.TestEntity.ToList());
}
}
Index
@model IEnumerable<DailyMVCDemo3.Models.TestEntity>
<table id="table1" class="table">
<thead>
<tr>
<th>
Index
</th>
<th>
Name
</th>
<th></th>
</tr>
</thead>
<tbody>
@{
int i = 0;
foreach (var item in Model)
{
i++;
<tr>
<td>
<p>
@i
</p>
</td>
<td>
@Html.DisplayFor(modelItem => item.Name)
</td>
<td>
@Html.ActionLink("ویرایش", "Edit", new { id = item.Id }) |
@Html.ActionLink("جزئیات", "Details", new { id = item.Id }) |
@Html.ActionLink("حذف", "Delete", new { id = item.Id })
</td>
</tr>
}
}
</tbody>
</table>
@section scripts{
<script>
$("#table1").DataTable();
</script>
}
.NET forums are moving to a new home on Microsoft Q&A, we encourage you to go to Microsoft Q&A for .NET for posting new questions and get involved today.
Member
38 Points
145 Posts
how to add pagging to informaton on view in mvc ?
Feb 23, 2021 10:41 AM|aabedeni056|LINK
hello.
i have view :
@model IEnumerable<MainNoteIt.Models.entity>
@using Microsoft.AspNet.Identity
@using System.Globalization;
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<link href="~/Content/bootstrap-rtl.min.css" rel="stylesheet" />
<link rel="stylesheet" href="~/StyleSheetshow1.css" />
<link href="~/StyleSheet.css" rel="stylesheet" />
<title> نمایش فعالیتهای کارشناس </title>
</head>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink(" اطلاعات فعالیتهای واحد", "", "", null, new { @class = "navbar-brand" })
<a href="#"><img src="~/Images/logo shabake golestan.png" width="52" height="48" style="margin-right:1100px" /></a>
</div>
<div class="navbar-collapse collapse">
</div>
</div>
</div>
<body dir="rtl" style="margin-top:80px">
<p >
<div dir="rtl" style="font-family:Tahoma" class="glyphicon-triangle-right" >
@Html.ActionLink("ثبت فعالیت جدید", "Create")
</div>
<div dir="ltr" style="font-family:Tahoma" class="glyphicon-triangle-right" >
@Html.ActionLink("برگشت به صفحه اصلی", "Index")
</div>
</p>
<table id="table1">
<tr>
<th>
شماره سطر
</th>
<th>
ردیف
</th>
<th>
تاریخ
</th>
<th>
متقاضی
</th>
<th>
حوزه
</th>
<th>
واحد
</th>
<th>
شرح کار
</th>
<th>
کارشناس
</th>
<th>
زمان(دقیقه)
</th>
<th>
مدل پاسخ
</th>
<th>
ملاحظات
</th>
<th></th>
</tr>
@{
int i = 0;
foreach (var item in Model)
{
i++;
<tr>
<td>
<p>
@i
</p>
</td>
<td>
@Html.DisplayFor(modelItem => item.date)
</td>
<td>
@Html.DisplayFor(modelItem => item.moteghazi)
</td>
<td>
@Html.DisplayFor(modelItem => item.hozeh)
</td>
<td>
@Html.DisplayFor(modelItem => item.vahed)
</td>
<td>
@Html.DisplayFor(modelItem => item.sharhkar)
</td>
<td>
@Html.DisplayFor(modelItem => item.karshenas)
</td>
<td>
@Html.DisplayFor(modelItem => item.time)
</td>
<td>
@Html.DisplayFor(modelItem => item.modelpasokh)
</td>
<td>
@Html.DisplayFor(modelItem => item.molahezat)
</td>
<td>
@Html.ActionLink("ویرایش", "Edit", new { id = item.id }) |
@Html.ActionLink("جزئیات", "Details", new { id = item.id }) |
@Html.ActionLink("حذف", "Delete", new { id = item.id })
</td>
</tr>
}
}
</table>
<div dir="rtl" style="width:180px" class="alert-info">
<h3 style="margin-right:20px">تعداد فعالیت=@i</h3>
</div>
@Styles.Render("~/newContent/css")
</body>
</html>
how to paging without change my model , just in view ?
All-Star
58164 Points
15646 Posts
Re: how to add pagging to informaton on view in mvc ?
Feb 23, 2021 03:40 PM|bruce (sqlwork.com)|LINK
Paging is implemented in the controller. Typically you just add a links in the view that pass the desired page number to the action. Usually a previous and next button, but maybe a list of page numbers. Optionally the page size is included.
Contributor
2690 Points
774 Posts
Re: how to add pagging to informaton on view in mvc ?
Feb 24, 2021 02:38 AM|YihuiSun|LINK
Hi aabedeni056,
You can use jquery.dataTables. I wrote an example, you can refer to it.
Model
public class TestEntity { public int Id { get; set; } public string Name { get; set; } }Controller
public class TestEntityController : Controller { public DailyMVCDemoContext db = new DailyMVCDemoContext(); public ActionResult Index() { return View(db.TestEntity.ToList()); } }Index
@model IEnumerable<DailyMVCDemo3.Models.TestEntity> <table id="table1" class="table"> <thead> <tr> <th> Index </th> <th> Name </th> <th></th> </tr> </thead> <tbody> @{ int i = 0; foreach (var item in Model) { i++; <tr> <td> <p> @i </p> </td> <td> @Html.DisplayFor(modelItem => item.Name) </td> <td> @Html.ActionLink("ویرایش", "Edit", new { id = item.Id }) | @Html.ActionLink("جزئیات", "Details", new { id = item.Id }) | @Html.ActionLink("حذف", "Delete", new { id = item.Id }) </td> </tr> } } </tbody> </table> @section scripts{ <script> $("#table1").DataTable(); </script> }_Layout
... ... <link href="~/Content/DataTables/css/jquery.dataTables.min.css" rel="stylesheet" /> ... ... @Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/bootstrap") <script src="~/Scripts/DataTables/jquery.dataTables.min.js"></script> ... ...Here is the result.
Best Regards,
YihuiSun
Member
38 Points
145 Posts
Re: how to add pagging to informaton on view in mvc ?
9 hours, 24 minutes ago|aabedeni056|LINK
hello . thanks a lot
excuse me . i must change my code?
i dont khnow how to change my code
it needs to change my code in controller or just view?