Riflettere il valore modificato nell'azione dopo la pubblicazione del modulo nella visualizzazione

ambiente

Visual Studio

• Visual Studio 2022

ASP.NET Di Base

• 6,0 MVC

Funziona in ambienti diversi da quelli sopra, ma il codice pubblicato è stato scritto nel framework sopra.

Cosa fare

Prova a creare un semplice programma che dice "Pubblica il testo che hai digitato sullo schermo e restituisci il testo elaborato alla stessa schermata di un nuovo risultato".

codice

La base è la creazione di un nuovo progetto MVC, da cui si aggiunge codice. Il codice è pubblicato per la configurazione complessiva, quindi si prega di fare riferimento ad esso.

Modello (viewmodel)

Creare il modello seguente per l'interazione tra visualizzazione e azione: ResultValue Ce ne sono due, ma volevo dare due risultati nella vista, quindi ne ho preparati due.

Metodo SampleViewModel

namespace PostValueChange.Models
{
  public class SampleViewModel
  {
    /// <summary>入力値を受け取るプロパティ。</summary>
    public string? InputValue { get; set; }

    /// <summary>結果を出力するプロパティ。</summary>
    public string? ResultValue1 { get; set; }

    /// <summary>結果を出力するプロパティ。</summary>
    public string? ResultValue2 { get; set; }
  }
}

azione

È un processo semplice: visualizzare la vista, prendere il testo inserito in POST, elaborarlo e restituire il risultato.

HomeControllore

// 省略

namespace PostValueChange.Controllers
{
  public class HomeController : Controller
  {
    // 省略

    [HttpGet]
    public IActionResult Sample() => View();

    [HttpPost]
    public IActionResult Sample(SampleViewModel model)
    {
      if (ModelState.IsValid == false) View(model);
      model.ResultValue1 = model.InputValue + " テキストを追加1";
      model.ResultValue2 = model.InputValue + " テキストを追加2";
      return View(model);
    }
  }
}

vista

Creare viste basate su azioni e modelli.

Quando si fa ResultValue1 clic sul pulsante di aggiornamento e ResultValue2 vengono visualizzati, ma vengono visualizzati rispettivamente in "testo di input" e "in tag div".

Esempio.cshtml

@model PostValueChange.Models.SampleViewModel

@{
  ViewData["Title"] = "Sample";
}

<h1>Sample</h1>

<h4>SampleViewModel</h4>
<hr />
<div class="row">
  <div class="col-md-4">
    <form asp-action="Sample" >
      <div asp-validation-summary="ModelOnly" class="text-danger"></div>
      <div class="form-group">
        <label asp-for="InputValue" class="control-label"></label>
        <input asp-for="InputValue" class="form-control" />
        <span asp-validation-for="InputValue" class="text-danger"></span>
      </div>
      <div class="form-group">
        <input type="submit" value="更新" class="btn btn-primary" />
      </div>
      <div class="form-group">
        <label asp-for="ResultValue1" class="control-label"></label>
        <input asp-for="ResultValue1" class="form-control" />
        <span asp-validation-for="ResultValue1" class="text-danger"></span>
      </div>
      <div>@Model?.ResultValue2</div>
    </form>
  </div>
</div>

<div>
  <a asp-action="Index">前の画面に戻る</a>
</div>

@section Scripts {
  @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

Index.cshtml Aggiungere un collegamento in modo da poter eseguire la transizione da Sample a .

Index.cshtml

@{
  ViewData["Title"] = "Home Page";
}

<div class="text-center">
  <h1 class="display-4">Welcome</h1>
  <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

<a asp-action="Sample">Sample</a>    @* 追加 *@

L'aggiornamento del modello ricevuto nel processo POST non influisce sull'input della vista, ecc.

Eseguire il codice creato in precedenza, immettere dalla InputValue schermata Di esempio e provare ad aggiornare.

Sul lato dell'azione, ResultValue1 poiché i valori sono impostati e ResultValue2 restituiti, si presume che entrambi siano originariamente visualizzati, ma in realtà div vengono visualizzati solo i 2 set nel tag.

Il valore impostato su ModelState ha la precedenza

Quando il client POST il valore di input, il valore viene impostato sulla variabile del modello dell'argomento ControllerBase.ModelState , ma viene impostato anche il valore. Il valore immesso viene ModelState quindi convalidato con il valore impostato su . ModelState.IsValid Questo è il motivo per cui viene giudicato in. Durante il debug, è possibile controllare il contenuto interrompendo l'elaborazione al punto di interruzione.

Se in origine si desidera restituire un valore alla visualizzazione, è return View(model); possibile includere , ma se un valore è ModelState impostato su ,ModelState il valore di ha la precedenza e viene restituito alla visualizzazione.

ModelState Poiché il valore impostato su è un valore inviato inserendo la vista, ecc., In termini di InputValuemodello, , ResultValue1 è impostato. Di conseguenza,ResultValue1 il valore di ha ModelState la precedenzaModelState e il valore impostato nel modello che non ResultValue2 è impostato su viene visualizzato nella vista.

Per restituire un valore a una vista a favore di un valore del modello

ModelState Valori impostati per avere la precedenza sulla vista, quindi se ModelState cancellate i valori impostati su , il valore del modello verrà restituito alla vista.

ModelState.Clear() È possibile cancellare tutti i valori che ha chiamando ModelState come segue:

[HttpPost]
public IActionResult Sample(SampleViewModel model)
{
  if (ModelState.IsValid == false) View(model);

  // ModelState の値を消してモデルの値をビューに返却できるようにする
  ModelState.Clear();

  // ビューに返す値を設定する
  model.ResultValue1 = model.InputValue + " テキストを追加1";
  model.ResultValue2 = model.InputValue + " テキストを追加2";

  return View(model);
}

ModelState sta anche eseguendo il processo di convalida,ModelState.Clear quindi assicurati ModelState.IsValid di leggerlo dopo quando chiami .

Quando lo si esegue, il risultato verrà visualizzato correttamente come segue.

ModelState.Clear Poiché tutti i valori scompaiono quando si chiama un metodo, è anche possibile specificare il nome della proprietà del modello e cancellare i valori singolarmente come indicato di seguito.

[HttpPost]
public IActionResult Sample(SampleViewModel model)
{
  if (ModelState.IsValid == false) View(model);

  // ModelState の値を消してモデルの値をビューに返却できるようにする
  ModelState.Remove(nameof(model.ResultValue1));

  // ビューに返す値を設定する
  model.ResultValue1 = model.InputValue + " テキストを追加1";
  model.ResultValue2 = model.InputValue + " テキストを追加2";

  return View(model);
}