Heijastaa toiminnossa muutettua arvoa lomakkeen julkaisun jälkeen näkymässä

ympäristö

Visual Studio

• Visual Studio 2022

ASP.NET ydin

• 6,0 MVC

Se toimii muissa kuin edellä mainituissa ympäristöissä, mutta julkaistu koodi on kirjoitettu yllä olevaan kehykseen.

Mitä tehdä

Yritä luoda yksinkertainen ohjelma, jossa lukee "Lähetä kirjoittamasi teksti näytölle ja palauta käsitelty teksti samaan näyttöön kuin uusi tulos."

koodi

Perustana on uuden MVC-projektin luominen, josta lisäät koodia. Koodi julkaistaan yleistä kokoonpanoa varten, joten katso sitä.

Malli (viewmodel)

Luo seuraava malli näkymän ja toiminnon vuorovaikutusta varten: ResultValue Niitä on kaksi, mutta halusin antaa kaksi tulosta, joten valmistelin kaksi.

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; }
  }
}

toiminta

Se on yksinkertainen prosessi: saat näyttää näkymän, ottaa POST:ään kirjoitetun tekstin, käsitellä sen ja palauttaa tuloksen.

HomeController

// 省略

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);
    }
  }
}

näkymä

Luo näkymiä toimintojen ja mallien perusteella.

Kun napsautat ResultValue1 päivityspainiketta ja ResultValue2 näytetään, mutta ne näkyvät vastaavasti "syöttötekstissä" ja "div-tunnisteessa".

Sample.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 Lisää linkki, jonka avulla voit siirtyä -järjestelmästä Sample -järjestelmään.

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>    @* 追加 *@

POST-prosessissa vastaanotetun mallin päivittäminen ei vaikuta näkymän syötteeseen jne.

Suorita yllä luomasi koodi, kirjoita InputValue mallinäytöstä ja yritä päivittää.

Toimintopuolella, ResultValue1 koska arvot on asetettu ja ResultValue2 palautettu, oletetaan, että molemmat näytetään alun perin, mutta itse asiassa div vain tunnisteessa olevat 2-sarjat näytetään.

ModelState-arvoksi määritetty arvo on etusijalla

Kun asiakas asettaa syöttöarvon, arvoksi määritetään argumentin mallimuuttuja ControllerBase.ModelState , mutta myös arvo määritetään. Annettu arvo ModelState vahvistetaan sitten arvolla , jonka arvo on . ModelState.IsValid Siksi se tuomitaan. Virheenkorjauksen aikana voit tarkistaa sisällön lopettamalla käsittelyn keskeytyskohdassa.

Jos haluat alun perin palauttaa arvon näkymään, voit sisällyttää - ja -arvon, return View(model); mutta jos arvoksi on määritetty ,ModelState -arvo on ModelState etusijalla ja palautetaan näkymään.

ModelState Koska arvo, johon on määritetty, on arvo, joka lähetetään syöttämällä näkymä jne., mallin mukaan InputValue, on ResultValue1 asetettu. ResultValue1 Tämän vuoksi -arvo on etusijalla ModelState , ja mallissa määritetty arvo,ModelState jota ei ole ResultValue2 määritetty, näkyy näkymässä.

Arvon palauttaminen näkymään malliarvon hyväksi

ModelState Arvot on määritetty näkymään nähden ensisijaisiksi, joten jos ModelState poistat -asetuksena olevat arvot, mallin arvo palautetaan näkymään.

ModelState.Clear() Voit poistaa kaikki arvot, joita on, soittamalla ModelState seuraavasti:

[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 tekee myös vahvistusprosessia,ModelState.Clear joten muista ModelState.IsValid lukea se puhelun jälkeen, kun soitat .

Kun suoritat sen, tulos näkyy oikein seuraavasti.

ModelState.Clear Koska kaikki arvot katoavat, kun kutsut menetelmää, on myös mahdollista määrittää mallin ominaisuuden nimi ja poistaa arvot erikseen seuraavasti.

[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);
}