html表中的MVC分页答案

【问题标题】：MVC pagination in html tablehtml表中的MVC分页
【发布时间】：2014-10-01 20:24:07
【问题描述】：

我有一个带有搜索按钮的搜索表单。当用户输入所有搜索输入字段并按下搜索按钮时，将仅返回同一页面中 html 表中的前 10 条记录。我已经做到了。

当用户按下下一页按钮时，我必须保留用户输入的值并将其发送到数据库并获取接下来的 10 条记录。

当我按下搜索按钮（第一个 http 帖子）时，视图模型具有用户输入的所有值，但是当我按下下一页按钮单击（第二个帖子）时，视图模型没有保留用户输入的值在搜索输入字段中。

我被建议不要使用临时数据将值从一个动作传递到另一个动作。有没有其他方法可以做到这一点？

【问题讨论】：

你能发布你的代码吗？
我还没有完成编码。我正在寻找样品。

标签： asp.net-mvc

【解决方案1】：

您是否考虑过 PagedList 库进行分页？您所要做的就是在您的 ASP.NET MVC 应用程序中引用 PagedList 库

要安装 PagedList.Mvc，请在包管理器控制台中运行以下命令。你也可以使用 NuGet 来获取这个包。

PM> Install-Package PagedList.Mvc

你的视图模型

public class QuestionViewModel
{
        public int QuestionId { get; set; }
        public string QuestionName { get; set; }
}

在您的控制器中，引用 PagedList

using PagedList;
and the Index method of your controller will be something like

public ActionResult Index(int? page)
{
            var questions = new[] {
                new QuestionViewModel { QuestionId = 1, QuestionName = "Question 1" },
                new QuestionViewModel { QuestionId = 1, QuestionName = "Question 2" },
                new QuestionViewModel { QuestionId = 1, QuestionName = "Question 3" },
                new QuestionViewModel { QuestionId = 1, QuestionName = "Question 4" }
            };

            int pageSize = 3;
            int pageNumber = (page ?? 1);
            return View(questions.ToPagedList(pageNumber, pageSize));
}

还有你的索引视图

@model PagedList.IPagedList<ViewModel.QuestionViewModel>
@using PagedList.Mvc; 
<link href="/Content/PagedList.css" rel="stylesheet" type="text/css" />


<table>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.QuestionId)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.QuestionName)
        </td>
    </tr>
}

</table>

<br />

Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount
@Html.PagedListPager( Model, page => Url.Action("Index", new { page }) )

最终的屏幕看起来像

【讨论】：

当我得到结果时，我将获得数百万条记录。在你的例如。 var question = 我无法将百万条记录绑定到这个变量。当我按第二页时，我必须再次调用数据库并获取第二组记录。存储过程将负责返回第二组记录。但是当我按下第二页按钮时，我传递了相同的搜索输入值。
那么你必须编写自己的自定义代码来做到这一点，这应该不难。如果单击next page button 时搜索输入值丢失，那么我猜您正在某个地方重置视图模型值。如果您使用具有强类型视图的视图模型，那么它应该保留输入值，除非您重新初始化 vm 类。
@SaravananGengan... 如果您不执行“.ToList()”，则不会在数据库中执行您的查询。所以...它仅在您执行 questions.ToPagedList(1,20) 时执行。因此，该列表将只有 20 条记录。试试这个......并检查您是否需要其他解决方案。
项目已移至github.com/dncuug/X.PagedList

【解决方案2】：

您真的应该尝试使用已经支持此功能的现有网格，例如查看：Datatables。

它是一个基于 JQuery 的网格，可以为您处理分页、过滤、排序等。如果您有大量数据，它甚至允许您在服务器端检索它。记住：“不要重新发明轮子”

【讨论】：

我不允许使用数据表。我们可以只使用 MVC 做到这一点吗？

【解决方案3】：

是的，您需要在 PAGE 操作中传递当前搜索参数。请记住，在 ASP.NET MVC 中，您需要将信息重新发布到服务器……因为它不保存状态。

如果你使用 PagedList 包，你可以这样做：

@Html.PagedListPager(Model.YourList, page => Url.Action("PostAction", new { page, Model.SearchString,Model.OtherFilter, sortOrder = ViewBag.CurrentSort}))

如果不是，请查看：https://github.com/troygoode/PagedList

在那里你可以看到一些代码示例......但是可以通过Nuget安装组件。

在 Stackoverflow 中，您可以看到很多关于 PagedList 的问题/答案

【讨论】：