如何限制“页面”显示的数据

本文关键字：显示 数据 页面 何限制 | 更新日期: 2023-09-27 18:11:17

我有一个包含许多数据行的列表。我通过表标记列出它们(参见代码)，这是一个很长的列表。

然而，我如何限制它们，例如每个"页面"最多10个数据行，在底部有一个小的"上一个/下一个"按钮，以列出/导航到下一个10个数据行(如谷歌搜索页面，它有最好的地方转储主体)

 public ActionResult Index() {
        var listAll = db.Reviews.Include(m => m.User);
        return View(listAll.ToList());           
  }

如何限制“页面”显示的数据

你必须使用分页，这将只显示一些记录在一个时间和记录下面的用户将有选项导航，就像谷歌搜索，你也必须改变你的控制器检索记录的数量显示，以避免击中数据库而不需要。

首先，通过点击Tools -> NuGet Package Manager ->Package Manager Console打开NuGet Package Manager Console

然后输入以下命令

Install-Package MVC4.Paging

这将安装一个库，在表

下面绘制分页控件

打开视图并添加以下代码

@using MvcPaging
@model IPagedList<Your Model Class>
Put here your table that lists the items
<div class="pager">
    @Html.Raw(Ajax.Pager(
            new Options
            {
                PageSize = Model.PageSize,
                TotalItemCount = Model.TotalItemCount,
                CurrentPage = Model.PageNumber,
                ItemTexts = new ItemTexts() { Next = "Next", Previous = "Previous", Page = "" },
                ItemIcon = new ItemIcon() { First = "icon-backward", Previous = "icon-chevron-left", Next = "icon-chevron-right", Last = "icon-forward" },
                TooltipTitles = new TooltipTitles() { Next = "Next page", Previous = "Previous page", Page = "Page {0}." },
                Size = Size.normal,
                Alignment = Alignment.centered,
                IsShowControls = true,
                IsShowFirstLast = true,
                CssClass = ""
            },
            new AjaxOptions
            {
                HttpMethod = "post",
            }, new { controller = "YourController", action = "YourAction" }))
</div>
<link href="~/Content/paging.css" rel="stylesheet" />

现在，你必须改变你的控制器动作如下

      using MvcPaging;
      public ActionResult Index(int? page) {
            int currentPageIndex = page.HasValue ? page.Value : 1;
            var results = db.Reviews.Include(m => m.User);
            results = results.OrderBy(a => a.Id);
            var totalCount = results.Count();
            var pagedResults = results.ToPagedList(currentPageIndex, defaultPageSize, totalCount);
        return View(pagedResults ;           
       }
相关文章：