У меня есть требование создать форму, которая принимает следующую (сильно упрощенную) модель данных:
public class MyPost {
public string MyTitle { get; set; }
public List<DateTime> Dates { get; set; } = new();
}
Проблема заключается в том, что может быть много дат, и пользователю необходимо генерировать их на основе определенных критериев (например, «разовая дата» или генерировать даты, которые проходят «каждую среду до 30 декабря», или любую комбинацию). Поэтому мне нужна функциональность в форме, чтобы пользователь мог генерировать/просматривать даты до того, как форма будет окончательно отправлена.
Я новичок в .Net Core, поэтому, пожалуйста, извините мое невежество, так как я страдаю от перегрузки учебника.
Надеясь использовать Blazor вместо JavaScript из-за аккуратной функциональности даты в C#, я создал компонент Blazor для этого, но любое взаимодействие (например, @onclick
) запускает HTTP-публикацию на родительской странице Razor, которая ломает все.
Таким образом, возможно ли взаимодействовать с компонентом Blazor внутри формы страницы Razor, не вызывая POST формы?
Взяв пример компонента счетчика от Microsoft и упростив его:
<p>Count: @currentCount</p>
<button @onclick = "IncrementCount">Click me</button>
@code {
private int currentCount = 0;
private void IncrementCount()
{
currentCount++;
}
}
Если затем поместить это на страницу Razor (cshtml) как внутри, так и вне тега <form>
, я вижу совершенно разные результаты, когда происходит взаимодействие.
<h3>Outside form tag</h3>
<Counter />
<form method = "post">
<h3>Inside form tag</h3>
<Counter />
</form>
@onclick
.Можно ли использовать компонент для создания динамической формы страниц Razor или всю форму нужно перемещать внутри компонента (последний в настоящее время требует много работы, поэтому и возникает причина этого вопроса, прежде чем я сделаю что-нибудь ненужное)?
Проблема здесь в том, что кнопки внутри форм обрабатываются как type = "submit"
. Вы должны добавить type = "button"
к своей фактической кнопке, тогда она должна работать без запроса POST.
<p>Count: @currentCount</p>
<button type = "button" @onclick = "IncrementCount">Click me</button>
@code {
private int currentCount = 0;
private void IncrementCount()
{
currentCount++;
}
}
Большое спасибо. После многих лет в игре я никогда не использовал тег button
, только input type
. Я даже не знал, что button type=button
это вещь. Для всех, кто читает это, есть хорошо объясненный ответ с обсуждением различий на stackoverflow.com/a/10079197/792888 или полное объяснение на html.com/attributes/button-type
Кажется, вы написали приложение WASM blazor. В этом случае вы можете выполнить POST с помощью HttpClient