Поддерживать состояние выпадающего при переходе на вторую страницу в пагинации

Question

У меня выпадающий список с несколькими предметами. Когда я ищу запись на основе выпадающего элемента, он дает мне результаты, связанные с ним. Я также включил в нее разбиение на страницы.

Когда я перехожу на вторую страницу, раскрывающееся значение возвращается в исходное состояние, которое не является правильным поведение. Он должен сохранять свое состояние, если я не обновлю sh всю страницу.

Нумерация страниц и поиск работают нормально. У меня проблема с поддержанием состояния раскрывающегося списка.

Например, если я выбрал 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>
}