Question

我的下拉菜单中没有几个项目。当我基于下拉项搜索记录时，它会为我提供与之相关的结果。我还实现了分页。

当我移至第二页时，下拉值返回其初始状态，这是不正确的行为。除非刷新整个页面，否则它应该保持其状态。

分页和搜索工作正常。我在维持下拉菜单状态时遇到问题。

例如，如果我从下拉菜单中选择了A，那么即使我进入了分页搜索的第二页，它也应保留A。

我简化了显示行为的代码。

控制器

Public async Task<IActionResult> Index(string searchText, string currentFilter, int? page)
    {

            int selectedPage = page ?? 1;
            int bypassCount = (selectedPage - 1) * _pagingOptions.PageSize;

            if (searchText != null)
            {
                page = 1;
            }
            else
            {
                searchText = currentFilter;

            }

            ViewBag.CurrentFilter = searchText;

    }

索引

<form asp-action="Index" method="get">

            <select class="custom-select" asp-for="searchText" value="@(ViewBag.CurrentFilter)">
                <option value="">All</option>
                <option value="AA">AA</option>
                <option value="AE">AE</option>
                <option value="AR">AR</option>
            </select>

         <div class="col-md-12">
            <button class="btn btn-primary" type="submit">Search</button>
         </div>                
        </form>

    <table class="table">
        <thead>
            <tr >
                <th>Message Id</th>
                <th>Status</th>
                <th>Resent</th>
                <th>Resent Date</th>
                <th>Created Date</th>
            </tr>
        </thead>
        <tbody>
            @if (Model.Items.TotalItemCount > 0)
            {
                @foreach (var item in Model.Items.ToList())
                {
                        <td>@Html.DisplayFor(modelItem => item.MessageId)</td>
                        <td>@Html.DisplayFor(modelItem => item.Status)</td>
                        <td>@Html.DisplayFor(modelItem => resentString)</td>
                        <td>@Html.DisplayFor(modelItem => resentDateString)</td>
                        <td>@Html.DisplayFor(modelItem => createdDateString)</td>
                    </tr>

                }
            }

        </tbody>
    </table>
</div>

            @if (Model.Items.PageCount > 1)
            {
                @Html.PagedListPager(Model.Items, page => Url.Action("Index", new { page = page, currentFilter = ViewBag.CurrentFilter}),
                                     new PagedListRenderOptions
                                     {
                                         UlElementClasses = new string[] { "pagination", "justify-content-left" },
                                         LiElementClasses = new string[] { "page-item" },
                                         PageClasses = new string[] { "page-link" },
                                         LinkToPreviousPageFormat = "Previous",
                                         LinkToNextPageFormat = "Next",
                                         DisplayEllipsesWhenNotShowingAllPageNumbers = true,
                                         DisplayLinkToPreviousPage = PagedListDisplayMode.Always,
                                         DisplayLinkToNextPage = PagedListDisplayMode.Always
                                     })
            }

Answer 1

尝试在视图中添加js代码，以分配@ViewBag.CurrentFilter的值以手动选择框：

<select id="mySelect" class="custom-select" asp-for="searchText" value="@(ViewBag.CurrentFilter)">
            <option value="">All</option>
            <option value="AA">AA</option>
            <option value="AE">AE</option>
            <option value="AR">AR</option>
</select>
@section Scripts {     
   <script>
       $(document).ready(function () {
           var data = '@ViewBag.CurrentFilter';

           document.getElementById("mySelect").value = data;
       });
   </script>
}

在转到分页的第二页时，保持下拉状态

1 个答案: