.NET 8分页点击页码时无法传递ViewModel日期值的问题

问题原因 #

1. 搜索表单与分页表单分离，分页表单未包含FromDate和ToDate字段，提交分页请求时无法携带日期参数
2. 分页使用的<a>标签发起GET请求，而控制器方法接收POST请求，参数绑定逻辑不匹配，导致日期值丢失
3. View中存在拼写错误：asp-for="FromTo" 应为 asp-for="ToDate"，会直接导致模型绑定失败

解决方案 #

方案1：合并表单+按钮提交（POST模式） #

将搜索区域、表格、分页全部放在同一个表单内，用按钮代替链接提交分页请求，自动携带日期参数。

修改后的View代码：

@model UsersViewModel
<form asp-controller="Users" asp-action="UsersAction" method="post">
    <!-- 搜索输入区 -->
    <input asp-for="FromDate" class="form-control" type="date" style="width:50%" />
    <input asp-for="ToDate" class="form-control" type="date" style="width:50%"/>
    
    <input type="submit" value="Search" />

    <!-- 表格区域 -->
    <!-- 你的Grid代码 -->

    <!-- 分页区域 -->
    @if (Model.Pagination.TotalPages > 0)
    {
        <ul class="pagination">
            @if (Model.Pagination.CurrentPage > 1)
            {
                <li class="page-item">
                    <button type="submit" class="page-link" name="page" value="1">First</button>
                </li>
                <li class="page-item">
                    <button type="submit" class="page-link" name="page" value="@(Model.Pagination.CurrentPage - 1)">
                        Previous
                    </button>
                </li>
            }

            @for (var pageNo = Model.Pagination.StartPage; pageNo <= Model.Pagination.EndPage; pageNo++)
            {
                <li class="page-item @(pageNo == Model.Pagination.CurrentPage ? "active" : "")">
                    <button type="submit" class="page-link" name="page" value="@pageNo">
                        @pageNo
                    </button>
                </li>
            }
        </ul>
    }
</form>

方案2：改用GET请求（支持书签保存） #

如果允许搜索参数通过URL传递，将控制器改为GET模式，分页链接直接携带日期参数。

控制器修改：

[HttpGet]
public IActionResult UsersAction(UsersViewModel searchinput, int page = 0, int pageSize = 10)
{
    // 数据查询逻辑
}

View修改：

@model UsersViewModel
<form asp-controller="Users" asp-action="UsersAction" method="get">
    <input asp-for="FromDate" class="form-control" type="date" style="width:50%" />
    <input asp-for="ToDate" class="form-control" type="date" style="width:50%"/>
    
    <input type="submit" value="Search" />
</form>

<!-- 表格区域 -->
<!-- 你的Grid代码 -->

<!-- 分页区域 -->
@if (Model.Pagination.TotalPages > 0)
{
    <ul class="pagination">
        @if (Model.Pagination.CurrentPage > 1)
        {
            <li class="page-item">
                <a class="page-link" 
                   asp-controller="Users" 
                   asp-action="UsersAction" 
                   asp-route-page="1"
                   asp-route-fromDate="@Model.FromDate"
                   asp-route-toDate="@Model.ToDate">
                    First
                </a>
            </li>
            <li class="page-item">
                <a class="page-link" 
                   asp-controller="Users" 
                   asp-action="UsersAction" 
                   asp-route-page="@(Model.Pagination.CurrentPage - 1)"
                   asp-route-fromDate="@Model.FromDate"
                   asp-route-toDate="@Model.ToDate">
                    Previous
                </a>
            </li>
        }

        @for (var pageNo = Model.Pagination.StartPage; pageNo <= Model.Pagination.EndPage; pageNo++)
        {
            <li class="page-item @(pageNo == Model.Pagination.CurrentPage ? "active" : "")">
                <a class="page-link" 
                   asp-controller="Users" 
                   asp-action="UsersAction" 
                   asp-route-page="@pageNo"
                   asp-route-fromDate="@Model.FromDate"
                   asp-route-toDate="@Model.ToDate">
                    @pageNo
                </a>
            </li>
        }
    </ul>
}

内容的提问来源于stack exchange，提问作者rdp