Reflecteix el valor canviat a l'acció després de la publicació del formulari a la visualització

Data de creació de la pàgina :

entorn

Estudi visual
  • Visual Studio 2022
nucli ASP.NET
  • 6,0 MVC

Funciona en entorns diferents de l'anterior, però el codi publicat va ser escrit en el marc anterior.

Què fer

Intenta crear un programa senzill que digui: "Publica el text que has escrit a la pantalla i torna el text processat a la mateixa pantalla que un resultat nou".

codi

La base és la creació d'un nou projecte MVC, a partir del qual s'afegeix codi. El codi es publica per a la configuració general, així que consulteu-lo.

Model (viewmodel)

Creeu el model següent per a la visualització i la interacció d'acció: ResultValue N'hi ha dos, però volia donar dos resultats a la vista, així que en vaig preparar dos.

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

acció

És un procés senzill: podeu mostrar la visualització, agafar el text introduït a POST, processar-lo i retornar-ne el resultat.

HomeControlador

// 省略

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

Crear visualitzacions basades en accions i models.

Quan feu ResultValue1 clic al botó d'actualització i ResultValue2 es mostren, però es mostren a "text d'entrada" i "in div tag", respectivament.

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 Afegiu un enllaç perquè pugueu passar de 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'actualització del model rebut en el procés POST no afecta l'entrada de la visualització, etc.

Executeu el codi que heu creat anteriorment, introduïu des de InputValue la pantalla d'exemple i proveu d'actualitzar-lo.

En el costat de l'acció, ResultValue1 ja que els valors s'estableixen i ResultValue2 es retornen, s'assumeix que tots dos es mostren originalment, però de fet div només es mostren els 2 conjunts de l'etiqueta.

El valor definit com a ModelState té prioritat

Quan el client TPV el valor d'entrada, el valor s'estableix a la variable model de l'argument ControllerBase.ModelState , però el valor també s'estableix. El valor introduït ModelState es valida amb el valor definit com a . ModelState.IsValid Per això es jutja. En depurar, podeu comprovar el contingut aturant el processament al punt d'interrupció.

Si originalment voleu retornar un valor a la visualització, està return View(model); bé incloure , però si un valor està ModelState definit com a ,ModelState el valor de té prioritat i es retorna a la visualització.

ModelStateAtès que el valor definit com a és un valor enviat introduint la visualització, etc., en termes del model, , ResultValue1 s'estableixInputValue. Per tant,ResultValue1 el valor de té ModelState prioritat,ModelState i el valor establert en el model que no ResultValue2 està definit es mostra a la visualització.

Per retornar un valor a una visualització a favor d'un valor de model

ModelState Valors definits per tenir prioritat a la visualització, de manera que si ModelState esborreu els valors definits com a , el valor del model es retornarà a la visualització.

ModelState.Clear() Podeu esborrar tots els valors que té ModelState cridant de la manera següent:

[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 també està fent el procés de validació,ModelState.Clear així que assegureu-vos de ModelState.IsValid llegir-lo després de quan truqueu .

Quan l'executeu, el resultat es mostrarà correctament de la manera següent.

ModelState.Clear Com que tots els valors desapareixen quan anomeneu un mètode, també és possible especificar el nom de propietat del model i esborrar els valors individualment de la manera següent.

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