Сохранять значения при отправке формы Razor Pages

Я использую Razor Pages 7. На моей странице есть фильтрация, сортировка и пейджинг.

MyPage.cshtml.cs

public SelectList Products { get; set; }
public int Sort { get; set; }
public int Page { get; set; }
public int Filter { get; set; }

public async Task OnGetAsync(int sort, int page, int filter) {
  //...
}

MyPage.cshtml

<form method = "get" asp-page = "" [email protected] [email protected]>
  <select name = "filter" [email protected]>
    <option selected value = "0">Filter by product</option>
  </select>
  <input type = "submit" value = "submit" />
</form>

Это правильно отображается как:

<form method = "get" action = "/mypage?sort=10&page=3">
  ...
</form>

Но когда я отправляю форму, действие get связывает только аргумент filter. Аргументы sort и page не связаны с action формы.

Предлагает ли RazorPages способ связать их?

(Я мог бы сделать это с помощью JavaScript, но я надеюсь, что есть собственный подход RazorPages.)


ОБНОВЛЕНИЕ
Я нашел способ, используя скрытые входы. В виде:

<input type = "hidden" name = "sort" [email protected] />
<input type = "hidden" name = "page" value=0 />  <!-- reset page on filter change -->

Но это ручной подход со многими волшебными строками. Есть ли «родной» способ RazorPages?

Предыстория информация.

lonix 17.02.2023 12:14
Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
0
1
51
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Это правильно отображается как:

<form method = "get" action = "/mypage?sort=10&page=3">   ... </form>

Он уже правильно соответствует asp-route-somekey=someval HTML, добавляя пары ключ-значение к части запроса.

Но когда я отправляю форму, действие get связывает только фильтр аргумент. Аргументы sort и page не привязаны к форме. действие

Фактически, это проблема, связанная с Html5, когда вы отправляете форму с помощью метода GET, параметры запроса атрибута действия будут удалены. Если вы проверите URL-адрес, это будет "/mypage?filter=someval"

Единственное решение для добавления параметров запроса, на которые вы сами ответили

Если вы согласны, добавьте аргументы в часть маршрута зарегистрируйте маршрут вашей страницы, например:

@page "/MyPage/{key1?}/{key2?}"

Результат:

Я только что попытался с помощью жесткого кодирования воспроизвести ошибку:

@{
    var dic = new Dictionary<string, string>()
    {
        {"key1","10"},
        {"key2","2"}
    };
}


<form method = "get" asp-page = "/MyPage" asp-all-route-data=@dic >
  <select name = "filter" >
    <option selected value = "0">Filter by product</option>
     <option  value = "1">item1</option>
      <option value = "2">item2</option>
  </select>
  <input type = "submit" value = "submit"  />
</form>

Спасибо за подтверждение. Есть ли какой-то «способ Razor Pages», чтобы сделать мой код более дружелюбным и иметь меньше волшебных строк? Может быть, какие-то помощники по тегам или что-то в этом роде? Я уже обнаружил, что есть полезный атрибут [HiddenInput].

lonix 17.02.2023 08:28

Я обновил решение, которое передает аргументы с частью маршрута, это может помочь, если вы примете передачу значения с маршрутом

Ruikai Feng 17.02.2023 08:32

Недавно я столкнулся со случаем, связанным с routedata, поэтому я придумал решение routedata, надеюсь, оно поможет stackoverflow.com/questions/75410483/…

Ruikai Feng 17.02.2023 08:37

Еще одна вещь, если вы не возражаете? Как выглядит ваш cshtml? Я написал свою форму без [BindProperty], но я вижу из вашего видео, что вы сделали это по-другому - и я предполагаю, что ваш способ лучше, чем мой, поэтому мне любопытно... :-)

lonix 17.02.2023 08:54

Я только что попытался воспроизвести ошибку с помощью жесткого кодирования, [BindProperty(SupportGet = "true")] attr позволяет вам привязать свойство модели страницы, когда вы нажимаете метод onget, поэтому мне не нужно снова писать аргументы, я просто привык к этому

Ruikai Feng 17.02.2023 09:05

Другие вопросы по теме