ตรวจสอบวิธีการทํางานของ asp-validation-summary

ปรับปรุงหน้า :
วันที่สร้างเพจ :

สภาพ แวด ล้อม

สตูดิโอภาพ
  • สตูดิโอภาพ 2019
แกนASP.NET
  • 3.0
  • 3.1

ตอนแรก

ASP.NET ไม่มีวิธีการใช้ asp-ตรวจสอบสรุปเป็นวิธีการแสดงข้อผิดพลาดในการตรวจสอบอินพุตบนหน้าจอในหลัก ฉันไม่เข้าใจจริงๆความแตกต่างระหว่างพารามิเตอร์ที่ฉันสามารถระบุดังนั้นฉันตรวจสอบมัน

ค่าที่เป็นไปได้สามค่า:

  • ไม่
  • โมเดลแบบ
  • ทั้ง หมด

ผลที่ได้คือ:

เตรียมก่อน

สําหรับเวลาเราจะเตรียมความพร้อมสําหรับการดําเนินงาน ส่วนใหญ่เป็นซ้ําซ้อนดังนั้นหากคุณต้องการเห็นผลลัพธ์ให้ดูครึ่งหลังของบทความ

การตรวจสอบนี้ถือว่าคุณต้องการลงทะเบียนผู้ใช้ในแบบฟอร์ม ดังนั้นเราจะสร้างแบบจําลองมุมมองสําหรับผู้ใช้ ฉันใส่รายการต่างๆ แต่เนื้อหาไม่สําคัญอะไรเพราะมันเป็นไปได้ที่จะตรวจสอบว่ามีอย่างน้อยหนึ่ง เราจะตรวจสอบกับ Dataหมายเหตุ ดังนั้นเราจะตั้งค่าแอตทริบิวต์ที่จําเป็นและ StringLength เพื่อเห็นความแตกต่างในพฤติกรรม, ฉันเพียงแค่ใส่ใน IsAccepted พิเศษ.

** รุ่น/ผู้ใช้มุมมองมุมมอง **

using System;
using System.ComponentModel.DataAnnotations;

namespace ValidationSummaryTest.Models
{
  public class UserViewModel
  {
    [Required]
    [StringLength(20)]
    public string ID { get; set; }

    [Required]
    [StringLength(50)]
    public string Name { get; set; }

    // 省略

    [Required]
    public bool IsAccepted { get; set; }
  }
}

เมื่อต้องการตรวจสอบสามค่าของ asp-การตรวจสอบสรุป สร้างแต่ละการกระทํา อย่างไรก็ตาม เนื่องจาก asp-ตรวจสอบสรุปเป็นเรื่องราวด้านมุมมองเนื้อหาของแต่ละการกระทําทั้งหมดรหัสเดียวกันยกเว้นข้อความ

ถ้า IsAccepted ไม่ได้ตรวจสอบเรากําลังเพิ่มข้อผิดพลาด ข้อผิดพลาดถูกเพิ่มไปยังข้อผิดพลาดด้วยคีย์ที่แตกต่างจากแบบจําลองและคีย์ว่างเปล่า

ถ้าไม่มีข้อผิดพลาด ให้แสดงข้อความการลงทะเบียนที่สําเร็จ

HomeController.cs

public IActionResult ValidateNone() => View();

[HttpPost]
public IActionResult ValidateNone(UserViewModel model)
{
  if (model.IsAccepted == false)
  {
    ModelState.AddModelError("PropertyName1", "プロパティに依存するエラー (None)");
    ModelState.AddModelError("", "空のキーエラー (None)");
  }
  if (ModelState.IsValid == false) return View(model);
  ViewData["Message"] = "正常に登録しました。";
  return View(model);
}

public IActionResult ValidateModelOnly() => View();

[HttpPost]
public IActionResult ValidateModelOnly(UserViewModel model)
{
  if (model.IsAccepted == false)
  {
    ModelState.AddModelError("PropertyName1", "プロパティに依存するエラー (ModelOnly)");
    ModelState.AddModelError("", "空のキーエラー (ModelOnly)");
  }
  if (ModelState.IsValid == false) return View(model);
  ViewData["Message"] = "正常に登録しました。";
  return View(model);
}

public IActionResult ValidateAll() => View();

[HttpPost]
public IActionResult ValidateAll(UserViewModel model)
{
  if (model.IsAccepted == false)
  {
    ModelState.AddModelError("PropertyName1", "プロパティに依存するエラー (All)");
    ModelState.AddModelError("", "空のキーエラー (All)");
  }
  if (ModelState.IsValid == false) return View(model);
  ViewData["Message"] = "正常に登録しました。";
  return View(model);
}

เพิ่มการเชื่อมโยงไปยังหน้าที่ทําการทดสอบแต่ละครั้ง

111.00

@{
    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>

<ul>
  <li><a asp-action="ValidateNone">ValidateNone</a></li>
  <li><a asp-action="ValidateModelOnly">ValidateModelOnly</a></li>
  <li><a asp-action="ValidateAll">ValidateAll</a></li>
</ul>

นี่คือหน้าการลงทะเบียนผู้ใช้สําหรับการตรวจสอบ ถ้ามีข้อผิดพลาด ให้ระบุไม่มีสําหรับ asp-การตรวจสอบสรุปเป็นพารามิเตอร์เพื่อแสดงเนื้อหาของพารามิเตอร์ นอกจากนี้เรายังใส่ประโยค "รายการข้อผิดพลาดโดยตรง" ในแท็ก div เพื่อดูว่าข้อความแสดงข้อผิดพลาดเริ่มต้นจะปรากฏขึ้น

รหัสอื่น ๆ ไม่ได้กล่าวถึงในรายละเอียดเพราะมันเป็นรหัสที่ถูกสร้างขึ้นโดยอัตโนมัติโดยนั่งร้านขึ้นอยู่กับรูปแบบ. (บางคนได้รับการแก้ไขด้วยมือ แต่ก็ไม่มีอะไรจะทําอย่างไรกับการตรวจสอบนี้.)

มีแท็ก span กับ asp-ตรวจสอบแอตทริบิวต์ที่ตั้งค่าใกล้แต่ละฟิลด์ป้อนข้อมูล (ใส่แท็ก) นี่คือแท็ก (แอตทริบิวต์) สําหรับแสดงข้อความแสดงข้อผิดพลาดสําหรับแต่ละช่องข้อมูลป้อนเข้า ข้อความแสดงข้อผิดพลาดจะถูกแสดงในตําแหน่งนั้นเสมอถ้าไม่มีข้อผิดพลาด

นอกจากนี้ asp-ตรวจสอบสรุปแสดงผลการตรวจสอบเซิร์ฟเวอร์ ดังนั้นกระบวนการตรวจสอบไคลเอ็นต์ (_ValidationScriptsPartial) ความคิดเห็นออก

ตรวจสอบการ

@model ValidationSummaryTest.Models.UserViewModel

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

<h1>ValidateNone</h1>

<h4>UserViewModel</h4>
<hr />
<div class="row">
  <div class="col-md-4">
    <form asp-action="ValidateNone">
    
      <div asp-validation-summary="None" class="text-danger">エラー直接入力</div>
      
      <div class="form-group">
        <label asp-for="ID" class="control-label"></label>
        <input asp-for="ID" class="form-control" />
        <span asp-validation-for="ID" class="text-danger"></span>
      </div>
      <div class="form-group">
        <label asp-for="Name" class="control-label"></label>
        <input asp-for="Name" class="form-control" />
        <span asp-validation-for="Name" class="text-danger"></span>
      </div>
      
      @* 省略 *@
      
      <div class="form-group form-check">
        <label class="form-check-label">
          <input class="form-check-input" asp-for="IsAccepted" /> @Html.DisplayNameFor(model => model.IsAccepted)
        </label>
      </div>
      <div class="form-group">
        <input type="submit" value="Create" class="btn btn-primary" />
      </div>
    </form>
  </div>
</div>

<div>
  <a asp-action="Index">Back to List</a>
</div>

@* サーバーのエラーを表示したいのでコメントアウト *@
@*@section Scripts {
  @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}*@

หน้า ValidateModelOnly.cshtml เป็นเพียงถ้าคุณระบุModelOnlyสําหรับการตรวจสอบ asp สรุป ข้อความที่แสดงจะเหมือนกับ ValidateNone.cshtml ที่แอบดู

ตรวจสอบข้อมูลภาพยนตร์

@model ValidationSummaryTest.Models.UserViewModel

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

<h1>ValidateModelOnly</h1>

<h4>UserViewModel</h4>
<hr />
<div class="row">
  <div class="col-md-4">
    <form asp-action="ValidateModelOnly">
      <div asp-validation-summary="ModelOnly" class="text-danger">エラー直接入力</div>
      
      @* 省略 *@

    </form>
  </div>
</div>

@* 省略 *@

หน้า ValidateAll.cshtml เกือบจะเหมือนกันยกเว้นสําหรับการระบุทั้งหมดสําหรับ asp-การตรวจสอบสรุป

ตรวจสอบทั้งหมด.cshtml

@model ValidationSummaryTest.Models.UserViewModel

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

<h1>ValidateAll</h1>

<h4>UserViewModel</h4>
<hr />
<div class="row">
  <div class="col-md-4">
    <form asp-action="ValidateAll">
      <div asp-validation-summary="All" class="text-danger">エラー直接入力</div>
    </form>

    @* 省略 *@
  </div>
</div>

@* 省略 *@

ตรวจสอบการดําเนินการ

ไม่

หลังจากที่คุณสร้างโปรแกรมแล้ว ให้ลองตรวจสอบการดําเนินการ asp-การตรวจสอบสรุป =ไม่มีหน้าจอ

เนื่องจาก "ข้อผิดพลาดโดยตรงอินพุต" จะแสดงในสถานะการแสดงผลเริ่มต้น, มันดูเหมือนจะไม่สามารถที่จะใช้เป็นข้อความแสดงข้อผิดพลาดเริ่มต้น. มีพารามิเตอร์ที่ถูกตั้งค่าเป็น Required ดังนั้นขอดําเนินการต่อเพื่อดําเนินการปรับปรุง

เป็นชื่อของไม่มีไม่มีสิ่งใดจะแสดงขึ้นหากมีข้อผิดพลาด ข้อความแสดงข้อผิดพลาดเริ่มต้นยังคงเหมือนเดิมดังนั้นจึงมีโอกาสไม่น่าที่จะตั้งค่า None โดยตรงและใช้ ถ้าคุณมีโอกาสที่จะใช้คุณต้องการตั้งค่าแบบไดนามิกเพื่อ asp-ตรวจสอบสรุปและไม่มีถ้าคุณไม่ต้องการเห็นข้อผิดพลาด?

โมเดลแบบ

สรุปการตรวจสอบ asp = หน้าจอที่มีแบบจําลองเท่านั้น ผมคิดว่ามีจํานวนมากใช้ฉากมากที่สุดเพราะมันออกมาในตัวอย่างของข้อผิดพลาดในการตรวจสอบและนั่งร้าน

เนื่องจากข้อความของ"ข้อผิดพลาดโดยตรงเข้า"ที่ถูกวางไว้ในแท็ก div จะไม่แสดงดูเหมือนว่ามีปัญหาแม้ว่าคุณจะใส่มัน

มันเป็นรัฐที่กระบวนการลงทะเบียนจะดําเนินการและข้อผิดพลาดจะปรากฏขึ้น ข้อความที่แสดงที่นี่เป็นข้อความเริ่มต้นที่ถูกวางไว้ก่อนหน้านี้ในแท็ก div และข้อความแสดงข้อผิดพลาดที่เกิดขึ้นทางด้านเซิร์ฟเวอร์ หมายเหตุ อย่างไรก็ตาม ว่า ถ้าคุณไม่มีข้อความคีย์ว่างที่อยู่ฝั่งเซิร์ฟเวอร์

บนฝั่งเซิร์ฟเวอร์ ข้อความแสดงข้อผิดพลาดสองจะถูกใส่ แต่เฉพาะข้อผิดพลาดที่มีอักขระว่างในคีย์จะแสดงขึ้น ถ้าคุณระบุคีย์ คีย์นั้นจะถูกถือว่าเป็นข้อผิดพลาดในคุณสมบัติของแบบจําลองที่มีชื่อนั้น ดังนั้นจะไม่ปรากฏใน asp-การตรวจสอบสรุป ข้อความจะปรากฏที่แท็กใดๆ ที่มีแอตทริบิวต์ asp-validation-for ของชื่อเดียวกันแทน

ทั้ง หมด

asp-การตรวจสอบสรุป =ทั้งหมดถูกระบุบนหน้าจอ

ข้อความของ "ป้อนเข้าโดยตรงข้อผิดพลาด" ถูกแสดงไว้ ผมไม่แน่ใจว่าทําไมฉันไม่เห็นรูปแบบคนเดียว ดูเหมือนว่าการฝังไม่สามารถใช้ในทั้งหมดในขณะนี้

มันเป็นหน้าจอหลังจากกระบวนการปรับปรุงจะดําเนินการตามที่มันเป็น ข้อความแสดงข้อผิดพลาดสําหรับเขตข้อมูลอินพุตทั้งหมด (คุณสมบัติ) จะแสดงในรายการ เขตข้อมูลอินพุตแต่ละฟิลด์ยังแสดงข้อความแสดงข้อผิดพลาดดังนั้นถ้าคุณต้องการระบุทั้งหมดเพื่อสรุปข้อผิดพลาด มันจะดีกว่าที่จะลบ asp-ตรวจสอบสําหรับแอตทริบิวต์การตั้งค่าสําหรับแต่ละฟิลด์ป้อนข้อมูล

ข้อความแสดงข้อผิดพลาดที่เพิ่มบนฝั่งเซิร์ฟเวอร์จะแสดง นอกจากนี้คุณยังเห็นว่าคุณกําลังดูข้อผิดพลาดด้วยคีย์

สรุป

สรุปการตรวจสอบความถูกต้อง asp มีพารามิเตอร์สามตัว คุณอาจต้องการใช้ ModelOnly เพื่อให้เข้าใจได้ง่ายขึ้นว่าข้อผิดพลาดอยู่ที่ไหน หรือเพื่อขจัดการทําซ้ํา โปรดสังเกตว่า ข้อความแสดงใน asp-การตรวจสอบสรุปเป็นข้อความที่มีคีย์ว่างเปล่า

โดยวิธีการคุณสามารถเพิ่มข้อความได้มากเท่าที่คุณต้องการไปยังคีย์ว่างดังนั้นคุณจึงไม่จําเป็นต้องรวมสตริงเพื่อแสดงข้อความหลายข้อความ

สําหรับทั้งหมดถ้าคุณต้องการรวบรวมข้อความแสดงข้อผิดพลาดในที่เดียว สําหรับไม่มี ตั้งค่าแบบไดนามิกเมื่อคุณไม่ต้องการให้ข้อความแสดงข้อผิดพลาดปรากฏขึ้นด้วยเหตุผลใด ๆ มันเป็นสิ่งที่ดีที่จะใช้เพื่อวัตถุประสงค์