使用 ASP.NET Core Razor 页面实现排序答案

【问题标题】：Implement Sorting With ASP.NET Core Razor Pages使用 ASP.NET Core Razor 页面实现排序
【发布时间】：2019-03-09 22:11:44
【问题描述】：

我编写了以下代码来实现排序。我想在两个排序请求之间维护sortingData（OrderDirection，SortField）。不知何故，我无法做到这一点。

//在.cshtml页面中

    @{
        SortingPagingInfo info = (SortingPagingInfo)ViewData["SortingPagingInfo"];
    }
<form method="post">
    @Html.Hidden("SortField", info.SortField)
    @Html.Hidden("SortDirection", info.SortDirection)
    @Html.Hidden("PageCount", info.PageCount)
    @Html.Hidden("PageSize", info.PageSize)
    @Html.Hidden("CurrentPageIndex", info.CurrentPageIndex)
 <table class="table">
        <thead>
            <tr>
                <th>
                    <a asp-page="./Page" asp-route-sortData="@info">
                        @Html.DisplayNameFor(model => model.Tabl[0].Col1)
                    </a>

                </th>
                <th>
                    <a asp-page="./Page" asp-route-sortData="@info">
                        @Html.DisplayNameFor(model => model.Tabl[0].Col2)
                    </a>

                </th>
 <th></th>
            </tr>
        </thead>
        <tbody>
            @foreach (var item in Model.Table)
            {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.Col1)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Col2)
                    </td>
</tr>
            }
        </tbody>
    </table>

</form>

-----在cshtml.cs页面中

获取请求如下：

public async Task OnGetAsync(SortingPagingInfo sortData)
        {
            SortingPagingInfo info = new SortingPagingInfo();
            if (string.IsNullOrEmpty(sortData.SortDirection))
            {
                info.SortField = "Col1";
                info.SortDirection = "OrderBy";
                info.PageSize = 10;
                info.PageCount = Convert.ToInt32(Math.Ceiling((double)(_context.Tab.Count()
                               / info.PageSize)));
                info.CurrentPageIndex = 0;
                this.sortPageData = info;
                ViewData["SortingPagingInfo"] = info;
            }
            else
            {
                info = (SortingPagingInfo)ViewData["SortingPagingInfo"];
            }
            tab1= await _context.Tabl.OrderByDynamic(info.SortField, info.SortDirection).ToListAsync();


        }

我正在尝试传递对象并将其保存在 ViewData 中，以便可以访问它。但每次都只返回空值。有没有更好的方法来实现使用 Razor 页面进行排序，或者如果这可以工作？

【问题讨论】：

<th> 标记中的这些 URL 是什么样的？

标签： c# sorting asp.net-core razor-pages

【解决方案1】：

您不能简单地将对象转储为链接上的路由数据参数。这里实际发生的是 Razor 将简单地在您的 info 实例上调用 ToString。您有几个选择：

拆分每个属性并单独传递：

<a asp-page="./Page" asp-route-sortField="@info.SortField" asp-route=sortDirection="@info.SortDirection" asp-route-pageCount="@info.PageCount" asp-route-pageSize="@info.PageSize" asp-route-currentPageIndex="@info.CurrentPageIndex">

序列化对象，然后在您的操作中反序列化它：

<a asp-page="./Page" asp-route-sortData="@JsonConvert.SerializeObject(info)">

然后，您的操作需要更改为接受字符串：

public async Task OnGetAsync(string sortData)

然后在操作中，您将该字符串反序列化回SortingPagingInfo 的实例：

var info = JsonCovert.DeserializeObject<SortingPagingInfo>(sortData);

改为让您的链接提交按钮（您仍然可以将它们设置为链接的样式）并让它们实际提交包含所有这些数据的表单：

<form asp-page-handler="./Page" method="get">
    @Html.Hidden("SortField", info.SortField)
    @Html.Hidden("SortDirection", info.SortDirection)
    @Html.Hidden("PageCount", info.PageCount)
    @Html.Hidden("PageSize", info.PageSize)
    @Html.Hidden("CurrentPageIndex", info.CurrentPageIndex)
    <button type="submit" class="btn btn-link">
        @Html.DisplayNameFor(model => model.Tabl[0].Col1)
    </button>
</form>

但是，您目前有一个包含整个表格的表单，并且您不能在表单中包含表单。因此，您需要重新构建 HTML 以确保这些链接中的每一个都位于页面上的任何其他表单之外。

【讨论】：