MVC 分页帮助 - 列出“第一”和“最后”之间的页面答案

【问题标题】：MVC Paging Help - List Pages in between 'First' and 'Last'MVC 分页帮助 - 列出“第一”和“最后”之间的页面
【发布时间】：2012-09-05 18:22:42
【问题描述】：

我已经基于nerddinner tutorial 实现了这个寻呼机。

我之前已将其设置为列出第一个链接和最后一个链接之间的所有页面，但是现在这越来越失控:) 在下面的示例中，我有用于分页的 HTML / 代码块。我现在将第一个和最后一个链接之间的页码列表减少到只有 10 个。

但这并没有改变。无论我在哪个页面上，它仍然会列出 1-10。我希望它显示接下来 10 页的链接。任何帮助将不胜感激！

<ul id="paginator">
    <% if (Model.HasPreviousPage)
       { %>
    <li>
        <%= Html.RouteLink("First Page", new { namespaces = "Admin", controller = "Products", action = "ViewAll", page = 0 })%></li>
    <% } %>
    <% else %>
    <% { %>
    <li>First Page</li>
    <% } %>
    <% for (int i = 0; i < 10; i++) %>
    <% { %>
    <% if (i == Model.PageIndex) %>
    <% { %>
    <li>
        <%: i+1 %></li>
    <% } %>
    <% else %>
    <% { %>
    <li>
        <%= Html.RouteLink((i + 1).ToString(), new { namespaces = "Admin", controller = "Products", action = "ViewAll", page = i })%>
    </li>
    <% } %>
    <% } %>-->
    <% if (Model.HasNextPage)
       { %>
    <li>
        <%= Html.RouteLink("Last Page", new { namespaces = "Admin", controller = "Products", action = "ViewAll", page = Model.TotalPages - 1 })%></li>
    <% } %>
    <% else %>
    <% { %>
    <li>Last Page</li>
    <% } %>
</ul>

【问题讨论】：

你到底为什么将每个花括号包裹在自己的一组

标签： c# asp.net-mvc pagination

【解决方案1】：

您可以使用当前页面来决定放置 10 个项目的位置，理想情况下，我想您希望在当前页面的任一侧显示 5 个页面（或在当前页面的任一侧显示 'n' 个页面）。这个算法相当容易实现......

var startingPage = currentPage - 5;
var endingPage = currentPage + 5;

唯一需要补充的是，如果起始页小于 1，或者结束页大于最终页，则需要填充 10 个结果。

最后，您需要处理没有 11 页结果的情况！

var startingPage = currentPage - 5;
if (startingPage < 1) {
    startingPage = 1;
}

var endingPage = currentPage + 11;
if (endingPage > numberOfPages) {
    endingPage = numberOfPages;
}

您现在有了创建页面链接的循环的开始和结束，当前页面在中间，除了分页的开始和结束。

for (int i = startingPage; i < endingPage; i++)

您可以将硬编码值从该代码中移出并缩短生产代码中的表达式 - 我已经按照我认为可以使概念变得最简单的方式来完成操作。

我还建议将此逻辑移动到一个帮助程序类中，如果您有多个需要此逻辑的页面，该类可以在您需要的任何地方创建页面链接。

【讨论】：

【解决方案2】：

您始终可以使用 WebHelpers 类中的 WebGrid Helper（可在 NuGet 上获得），它会为您提供所需的一切，包括分页，然后您只需使用 css 对其进行样式设置。

非常好的参考是：http://www.dotnetcurry.com/ShowArticle.aspx?ID=618

【讨论】：