Question

我目前正在为c＃asp.net中的简单项目创建自定义分页，到目前为止一直很好，但是＆＃34; Next＆＃34;和＆＃34;最后＆＃34;按钮不能正常工作。＆＃34;下一个＆＃34;按钮只返回当前页面，或者如果我在另一个大于1的页面上，它会返回1页。

＆＃34; Last＆＃34;按钮不会按预期转到最后一页。

我知道它只是视图中for循环中的某些内容，或者我在模型文件中缺少某些内容。

到目前为止，这是我的代码：

Index.cshtml（查看）

@model FinalPaginationTask.Models.UserCustom
<!DOCTYPE html>
    <html>
            <head>
                <link rel="stylesheet" href="Content/***.css" />
                <title> </title>
            </head>
        <body>

            <h2>List of Users</h2>
                @using (Html.BeginForm(null, null, FormMethod.Post))
                {
                    @Html.AntiForgeryToken()
                    @Html.Hidden("SortField", Model.SortField)
                    @Html.Hidden("SortDirection", Model.SortDirection)
                    @Html.Hidden("PageCount", Model.PageCount)
                    @Html.Hidden("PageSize", Model.PageSize)
                    @Html.Hidden("CurrentPageIndex", Model.CurrentPageIndex)

                    @*@Html.Hidden("SelectedUsr_Id", Model.SelectedUsr_Id)
                        @Html.Hidden("SelectedUsername", Model.SelectedUsername)*@

                    <table id="customers" class="table-striped">
                        <tr>
                            <th >
                                <a href="#" data-sortfield="usr_Id" class="header">@Html.DisplayNameFor(model => model.user.First().usr_Id)</a>
                            </th>
                            <th>
                                <a href="#" data-sortfield="username" class="header">@Html.DisplayNameFor(model => model.user.First().username)</a>
                            </th>
                            <th>
                                @Html.DisplayNameFor(model => model.user.First().email)
                            </th>
                            <th>

                            </th>
                        </tr>

                        <tr>
                            @*<th>
                                    @Html.DropDownListFor(model => model.SelectedUsr_Id,
                                        new SelectList(Model.userDDL, "usr_Id", "usr_Id", Model.SelectedUsr_Id), "All", new { @id = "fn" })
                                </th>
                                <th>
                                    @Html.DropDownListFor(model => model.SelectedUsername,
                                    new SelectList(Model.userDDL, "username", "username", Model.SelectedUsername), "All", new { @id = "ln" })
                                </th>*@
                        </tr>

                        @foreach (var item in Model.user)
                        {
                            <tr>
                                <td>
                                    @Html.DisplayFor(modelItem => item.usr_Id)
                                </td>
                                <td>
                                    @Html.DisplayFor(modelItem => item.username)
                                </td>
                                <td>
                                    @Html.DisplayFor(modelItem => item.email)
                                </td>
                                <td>
                                    @Html.ActionLink("Create User", "CreateUser", new { /* id=item.PrimaryKey */ }) |
                                    @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                                    @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
                                    @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
                                </td>
                            </tr>
                        }
                        <tr></tr>

                        @*@if (Model.Pager.LastPage > 1)
                        {*@

                            <tr class="pagination">
                                @if (Model.CurrentPageIndex >= 1)
                                {
                                    <td class="pager"><a href="~/User/">First</a></td>
                                    <td class="pager"><a href="~/User/Index/@(Model.CurrentPageIndex - 1)">Previous</a></td>
                                }
                                @for (var i = 0; i < Model.PageCount; i++)
                                {

                                    if (i == Model.CurrentPageIndex)
                                    {
                                        <td class="pager"><span class="current-pager" id="CurrentPageIndex">@(i + 1)</span></td>
                                    }
                                    else
                                    {
                                            <td class="pager" ><a href="~/User/Index/@i" data-pageindex="@i" class="pager">@(i + 1)</a></td>
                                    }
                                }
                                @if (Model.CurrentPageIndex < Model.PageCount)
                                {
                                    <td class="pager"><a href="~/User/Index/@(Model.CurrentPageIndex + 1)">Next</a></td>
                                    <td class="pager"><a href="~/User/Index/@(Model.PageCount)">Last</a></td>
                                }
                            </tr>
                        @*}*@

                    </table>
                }
        </body>
    </html>

    <script type="text/javascript">
        $(document).ready(function () {
            $(".header").click(function (evt) {
                var sortfield = $(evt.target).data("sortfield");
                if ($("#SortField").val() == sortfield) {
                    if ($("#SortDirection").val() == "ascending") {
                        $("#SortDirection").val("descending");
                    }
                    else {
                        $("#SortDirection").val("ascending");
                    }
                }
                else {
                    $("#SortField").val(sortfield);
                    $("#SortDirection").val("ascending");
                }
                evt.preventDefault();
                $("form").submit();

            });

            $(".pager").click(function (evt) {
                var pageindex = $(evt.target).data("pageindex");
                $("#CurrentPageIndex").val(pageindex);
                evt.preventDefault();
                $("form").submit();
            });

            $("#fn").change(function (evt) {
                $("#SelectedUsr_Id").val($("#fn").val().trim());
                evt.preventDefault();
                $("form").submit();
            })
            $("#ln").change(function (evt) {
                $("#SelectedUsername").val($("#ln").val().trim());
                evt.preventDefault();
                $("form").submit();
            })
        });
</script>

型号：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace FinalPaginationTask.Models
{
    public class SortAndPage // used for sorting and paging
    {
        public string SortField{ get; set; }
        public string SortDirection { get; set; }
        public int PageSize { get; set; }
        public int PageCount { get; set; }
        public int StartPage { get; set; }
        public int LastPage { get; set; }
        public int CurrentPageIndex { get; set; }
        public Pager Pager { get; set; }


    }
}

实际发生的实例截屏示例：

非常感谢任何帮助。非常感谢你！

编辑：我将添加控制器，因为可能需要其他信息：

public ActionResult Index(UserCustom userCustomModel = null)
{
    // start load customer
    //int i;
    //if (userCustomModel != null)
    //{
    //    i = userCustomModel.CurrentPageIndex;
    //}

    userCustomModel = new UserCustom
    {
        user = db.Users.ToList(),
        userDDL = db.Users.ToList()
    };
    // end load customer

    var res = (from s in userCustomModel.user
               select s);
    res = res.ToList();  /// select all users from the database

    if (userCustomModel.CurrentPageIndex == 0)
    {
        userCustomModel.CurrentPageIndex = 0;
    }

    userCustomModel.PageSize = 10;
    userCustomModel.PageCount = ((res.Count() + userCustomModel.PageSize - 1) / userCustomModel.PageSize);
                                // (7 + 5 - 1)  = 11 / 5 = 2 pages

    if (userCustomModel.CurrentPageIndex > userCustomModel.PageCount)
    {
        userCustomModel.CurrentPageIndex = userCustomModel.PageCount;
    }

    userCustomModel.user = res.Skip(userCustomModel.CurrentPageIndex * userCustomModel.PageSize).Take(userCustomModel.PageSize);
                                    // 0 * 5 = 0 (5) 
                                    // 1 * 5 = 5 skip 5.take 5-10


    return View(userCustomModel);
}

Answer 1

显示给用户的号码与索引之间存在差异。索引值的范围为0 .. PageCount-1，显示的数字范围为1 .. PageCount。

现在，如果我们查看Next和Last链接，我们可以看到两种方法的混淆：

<td class="pager"><a href="~/User/Index/@(Model.CurrentPageIndex + 1)">Next</a></td>
<td class="pager"><a href="~/User/Index/@(Model.PageCount)">Last</a></td>

第一个链接会增加CurrentPageIndex，这是一种有效的方法。然而，第二个将索引设置为PageCount，而索引的范围从我们建立的0 .. PageCount-1开始。这可以解释为什么Last链接不起作用，但Next链接应该在这种情况下正常工作。

另外检查：

@if (Model.CurrentPageIndex < Model.PageCount)

永远是真的，因为CurrentPageIndex最多可能是PageCount-1。

我建议您为Index操作方法设置断点，然后尝试使用单个链接查看您获得的值以及它们是否符合您的预期。虽然Next链接不起作用的原因并不明显，但应该可以根据描述从代码中找出。

“下一步”按钮只返回当前页面，或者如果我在另一页面上如果页面大于1，则返回1页。

根据此行为，我怀疑代码隐藏处理会从page参数中减去1，因此URL需要范围1 .. PageCount中的值，但您提供范围0 .. PageCount-1中的值。

更新

将动作方法代码添加到您的问题后（Controller中的每个公共方法按照惯例在ASP.NET中都称为action method :-)），我正在使用我的发现更新我的代码

首先，您的代码包含以下检查：

if (userCustomModel.CurrentPageIndex == 0)
{
   userCustomModel.CurrentPageIndex = 0;
}

你可以摆脱它，因为它不会改变任何东西:-)。

然而，主要问题是：

userCustomModel = new UserCustom
{
    user = db.Users.ToList(),
    userDDL = db.Users.ToList()
};

在这里，您要将userCustomModel设置为UserCustom的新实例，该实例基本上会覆盖您从请求网址收到的值。如果仅在null时初始化变量，并在下一行直接从数据库进行查询，则代码应该有效：

public ActionResult Index(UserCustom userCustomModel = null)
{
    //initialize only if null
    if ( userCustomModel == null )
    {
       userCustomModel = new UserCustom();
    }
    // end load customer

    var res = db.Users.ToList(); // select all users from the database

    userCustomModel.PageSize = 10;
    userCustomModel.PageCount = ((res.Count() + userCustomModel.PageSize - 1) / userCustomModel.PageSize);
                                // (7 + 5 - 1)  = 11 / 5 = 2 pages

    if (userCustomModel.CurrentPageIndex > userCustomModel.PageCount)
    {
        userCustomModel.CurrentPageIndex = userCustomModel.PageCount;
    }

    userCustomModel.user = res.Skip(userCustomModel.CurrentPageIndex * userCustomModel.PageSize).Take(userCustomModel.PageSize);
              // 0 * 5 = 0 (5) 
              // 1 * 5 = 5 skip 5.take 5-10

    userCustomMode.userDDL = res;


    return View(userCustomModel);
}

如果这不起作用，请检查路线，如果您的路线参数实际上称为CurrentPageIndex。您的操作方法参数可以简化为仅使用一个int：

public ActionResult Index(int currentPageIndex = 0)

现在，您的代码可以在每次使用userCustomModel变量作为当前页面时初始化currentPageIndex。

Answer 2

伙计，我不知道你为什么需要通过提交表格来处理导航。

请注意这个：

//$(".pager").click(function (evt) {
//    var pageindex = $(evt.target).data("pageindex");
//    $("#CurrentPageIndex").val(pageindex);
//    evt.preventDefault();
//    $("form").submit();
//});

再试一次。

我希望它有所帮助，因为我在没有使用上面更新的控制器的情况下尝试了这一点。

自定义分页，＆＃34; next＆＃34;和＆＃34;最后＆＃34;按钮无法正常工作

2 个答案:

更新