दृश्य में प्रपत्र के पोस्ट के बाद क्रिया में परिवर्तित मान को प्रतिबिंबित करें

पर्यावरण

दृश्य स्टूडियो

• विजुअल स्टूडियो 2022

ASP.NET कोर

• 6.0 MVC

यह उपरोक्त के अलावा अन्य वातावरणों में काम करता है, लेकिन प्रकाशित कोड ऊपर दिए गए ढांचे में लिखा गया था।

क्या करना है

एक साधारण प्रोग्राम बनाने का प्रयास करें जो कहता है, "स्क्रीन पर आपके द्वारा लिखे गए पाठ को पोस्ट करें और संसाधित पाठ को एक नए परिणाम के रूप में उसी स्क्रीन पर वापस करें।

कोड

आधार एक नए MVC प्रोजेक्ट का निर्माण है, जिसमें से आप कोड जोड़ते हैं। कोड समग्र कॉन्फ़िगरेशन के लिए प्रकाशित किया गया है, इसलिए कृपया इसे देखें।

मॉडल (दृश्य मॉडल)

दृश्य और क्रिया सहभागिता के लिए निम्न मॉडल बनाएँ: ResultValue दो हैं, लेकिन मैं दृश्य में दो परिणाम देना चाहता था, इसलिए मैंने दो तैयार किए।

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

क्रिया

यह एक सरल प्रक्रिया है: दृश्य प्रदर्शित करने के लिए मिलता है, पोस्ट में दर्ज पाठ ले लो, इसे संसाधित करें, और परिणाम वापस करें।

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

देखना

क्रियाओं और मॉडलों के आधार पर दृश्य बनाएँ.

जब आप ResultValue1 अद्यतन बटन क्लिक करते हैं, और ResultValue2 प्रदर्शित होते हैं, लेकिन वे क्रमशः "इनपुट टेक्स्ट" और "इन डिव टैग" में प्रदर्शित होते हैं।

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 कोई लिंक जोड़ें ताकि आप से Sample संक्रमण कर सकें.

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 प्रक्रिया में प्राप्त मॉडल को अद्यतन करने से दृश्य के इनपुट, आदि पर कोई प्रभाव नहीं पड़ता है.

आपके द्वारा ऊपर बनाए गए कोड को चलाएँ, नमूना स्क्रीन से InputValue दर्ज करें, और अद्यतन करने का प्रयास करें.

क्रिया पक्ष पर, ResultValue1 चूंकि मान सेट किए जाते हैं और ResultValue2 दिए जाते हैं, इसलिए यह माना जाता है कि दोनों मूल रूप से प्रदर्शित होते हैं, लेकिन वास्तव div में टैग में केवल 2 सेट प्रदर्शित होते हैं।

ModelState पर सेट किया गया मान वरीयता लेता है

क्लाइंट POSTs इनपुट मान, मान तर्क के मॉडल चर 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);
}