뷰에서 양식 의 게시물 후 작업에서 변경된 값을 반영합니다.

환경

비주얼 스튜디오

• 비주얼 스튜디오 2022

ASP.NET 코어

• 6.0 MVC

위의 환경 이외의 환경에서 작동하지만 게시된 코드는 위의 프레임워크에 기록되었습니다.

무엇을 만들어야 할지

"화면에 입력한 텍스트를 게시하고 처리된 텍스트를 새 결과로 동일한 화면으로 반환"하는 간단한 프로그램을 만들어 보세요.

코드

기본은 코드를 추가하는 새 MVC 프로젝트를 만드는 것입니다. 코드는 전체 구성에 대해 게시되므로 참조하십시오.

모델(뷰모델)

보기 및 작업 상호 작용을 위해 다음 모델을 만듭니다. ResultValue 두 가지가 있지만, 보기에서 두 가지 결과를 주고 싶었기 때문에 두 가지를 준비했습니다.

샘플뷰모델

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

행동

보기를 표시하고 POST에 입력된 텍스트를 처리하고 결과를 반환하는 간단한 프로세스입니다.

홈 컨트롤러

// 省略

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

보기

작업 및 모델을 기반으로 뷰를 만듭니다.

업데이트 버튼을 클릭하고 ResultValue1 ResultValue2 표시되지만 각각 "입력 텍스트"와 "indiv 태그"에 표시됩니다.

샘플.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 에서 로전환할 Sample 수 있도록 링크를 추가합니다.

인덱스.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 프로세스에서 받은 모델을 업데이트해도 뷰의 입력 등에 영향을 주지 않습니다.

위에서 만든 코드를 실행하고 샘플 화면에서 입력 InputValue 하고 업데이트하려고 합니다.

작업 측 ResultValue1 에서는 값이 설정되고 ResultValue2 반환되므로 둘 다 원래 표시되는 것으로 가정되지만 실제로 div 는 태그의 2 세트만 표시됩니다.

ModelState로 설정된 값이 우선합니다.

클라이언트가 입력 값을 POST에 넣으면 값이 인수의 ControllerBase.ModelState 모델 변수로 설정되지만 값도 설정됩니다. 그런 다음 입력 ModelState 된 값이 로 설정된 값으로 유효성을 검사합니다. ModelState.IsValid 그것이 판단되는 이유입니다. 디버깅 시 중단점에서 처리를 중지하여 내용을 확인할 수 있습니다.

원래 값을 뷰 return View(model); 에 반환하려면 포함해도 되지만 값이 설정된ModelState 경우 값이 ModelState 우선하며 뷰로 반환됩니다.

ModelState 설정된 값이 모델의 관점에서 InputValue뷰 등을 입력하여 전송되는 값이기 때문에 설정 ResultValue1 됩니다. 따라서ResultValue1 값이 ModelState 우선ModelState 하며 설정되지 않은 ResultValue2 모델의 값이 뷰에 표시됩니다.

모델 값에 찬성하여 값을 뷰로 반환하려면

ModelState 값이 뷰보다 우선하도록 설정되므로 설정된 값을 지울 경우 ModelState 모델값이 뷰로 반환됩니다.

ModelState.Clear() 다음과 같이 호출하여 ModelState 있는 모든 값을 지울 수 있습니다.

[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 또한 유효성 검사 프로세스를 수행 하므로ModelState.Clear 호출 할 때 다음을 읽어 야 합니다 ModelState.IsValid .

실행하면 결과가 다음과 같이 올바르게 표시됩니다.

ModelState.Clear 메서드를 호출할 때 모든 값이 사라지기 때문에 모델의 속성 이름을 지정하고 다음과 같이 개별적으로 값을 지울 수도 있습니다.

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