Voir comment fonctionne asp-validation-résumé

Environnement

Visual Studio

• Visual Studio 2019

ASP.NET Core

• 3.0
• 3.1

Au début,

ASP.NET Il existe un moyen d’utiliser asp-validation-résumé comme un moyen d’afficher les erreurs de validation d’entrée sur l’écran dans Core. Je n’ai pas vraiment compris la différence entre les paramètres que je pouvais spécifier, alors je l’ai vérifié.

Il y a trois valeurs possibles :

• Aucun
• ModelOnly
• Tous

À la suite de l’examen de la façon dont chacune de ces différences fonctionne, le résultat est le suivant:

Pré-préparation

Pour l’instant, nous nous préparerons à l’opération. La plupart d’entre eux sont redondants, donc si vous voulez seulement voir les résultats, voir la deuxième moitié de l’article.

Cette validation suppose que vous souhaitez enregistrer l’utilisateur dans le formulaire, nous allons donc créer un modèle d’affichage pour l’utilisateur. J’ai mis divers éléments, mais le contenu n’a pas d’importance quoi que ce soit, car il est possible de vérifier s’il ya au moins un. Nous allons vérifier avec DataAnnotation, donc nous allons définir les attributs Requis et StringLength. Pour voir la différence de comportement, je viens de mettre dans un IsAccepted supplémentaire.

** Modèles/UserViewModel **

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

Pour examiner les trois valeurs de l’asp-validation-résumé, créez chaque action. Toutefois, comme asp-validation-summary est une histoire côté vue, le contenu de chaque action sont tous le même code, sauf pour les messages.

Si IsAccepted n’est pas coché, nous ajoutons une erreur. L’erreur est ajoutée à l’erreur avec une touche différente de celle du modèle et une clé vide.

S’il n’y a pas d’erreurs, affichez un message d’inscription réussi.

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

Index.cshtml ajoute un lien vers la page où chaque test est effectué.

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>

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

Il s’agit de la page d’inscription de l’utilisateur pour la vérification. S’il y a une erreur, spécifiez None pour asp-validation-summary comme paramètre pour afficher son contenu. Nous avons également mis la phrase « Entrée directe d’erreur » dans la balise div pour voir si le message d’erreur par défaut est affiché.

D’autres codes ne sont pas discutés en détail car c’est le code qui a été généré automatiquement par échafaudage en fonction du modèle. (Certains d’entre eux ont été fixés à la main, mais cela n’a rien à voir avec cette vérification.)

Il existe une balise d’envergure avec l’attribut asp-validation-for défini près de chaque champ d’entrée (balise d’entrée). Il s’agit d’une balise (attribut) pour afficher des messages d’erreur pour chaque champ d’entrée. Quel que soit le paramètre spécifié dans asp-validation-summary, un message d’erreur s’affiche toujours à cet emplacement en cas d’erreur.

En outre, asp-validation-résumé affiche les résultats de vérification du serveur, de sorte que le processus de validation du client (_ValidationScriptsPartial) commentaires.

ValidateNone.cshtml

@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");}
}*@

Les pages ValidateModelOnly.cshtml ne sont que si vous spécifiez ModelOnly pour asp-validation-summary. Le texte d’affichage est le même que ValidateNone.cshtml jetant un coup d’œil.

ValidateModelOnly.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>

@* 省略 *@

Les pages ValidateAll.cshtml sont presque identiques, sauf pour spécifier tous pour asp-validation-summary.

ValidateAll.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>

@* 省略 *@

Vérifier l’opération

Aucun

Après avoir créé le programme, essayez de vérifier l’opération. asp-validation-summary=Aucun écran.

Étant donné que l'« entrée directe d’erreur » s’affiche dans l’état d’affichage initial, il ne semble pas pouvoir être utilisé comme message d’erreur par défaut. Il ya des paramètres qui ont été définies sur requis, nous allons donc continuer à effectuer le processus de mise à jour.

Comme nom de None, rien n’est affiché s’il y a une erreur. Le message d’erreur par défaut reste intact, il est donc peu probable qu’il y ait une chance de définir Aucun directement et de l’utiliser. Si vous avez une chance de l’utiliser, souhaitez-vous définir dynamiquement la valeur sur asp-validation-résumé et aucun si vous ne voulez pas voir une erreur?

ModelOnly

Asp-validation-summary= L’écran avecModelOnly. Je pense qu’il ya beaucoup de scènes d’utilisation le plus parce qu’il sort dans l’échantillon de l’erreur de vérification et l’échafaudage.

Puisque le texte de « Erreur entrée directe » qui a été placé dans la balise div n’est pas affiché, il semble qu’il n’y a pas de problème, même si vous le mettez.

Il s’agit d’un état dans lequel le processus d’enregistrement est effectué et l’erreur s’affiche. Les seuls messages affichés ici sont les messages par défaut qui ont été précédemment placés dans la balise div et les messages d’erreur qui se sont produits du côté du serveur. Notez toutefois que si vous n’avez pas de message de clé vide du côté du serveur, le message de la balise div n’apparaîtra pas.

Du côté du serveur, deux messages d’erreur sont mis, mais seule l’erreur avec des caractères vides dans la clé s’affiche. Si vous spécifiez une clé, elle sera traitée comme une erreur dans la propriété du modèle avec ce nom, de sorte qu’elle n’apparaît pas dans l’asp-validation-résumé. Au lieu de cela, un message s’affiche à n’importe quelle balise avec l’attribut asp-validation-pour du même nom.

Tous

Asp-validation-summary=Tout est spécifié à l’écran.

Pour une raison quelconque, le texte de l'« entrée directe d’erreur » incorporée s’affiche. Je ne sais pas pourquoi je ne vois pas ModelOnly seul. Il semble que l’intégration ne peut pas être utilisée dans Tous pour le moment.

Il s’agit d’un écran après le processus de mise à jour est effectuée telle qu’elle est. Les messages d’erreur pour tous les champs d’entrée (propriétés) sont affichés dans une liste. Chaque champ d’entrée affiche également un message d’erreur, donc si vous souhaitez spécifier Tout pour résumer l’erreur, Il serait préférable de supprimer l’asp-validation-pour l’attribut défini pour chaque champ d’entrée.

Les messages d’erreur ajoutés du côté du serveur s’affichent également. Vous pouvez également voir que vous affichez également une erreur avec la clé.

Résumé

Asp-validation-résumé avait trois paramètres. Vous pouvez utiliser ModelOnly pour faciliter la compréhension de l’endroit où se trouve l’erreur ou pour éliminer les doubles emplois. Notez que le seul message affiché dans asp-validation-summary est un message avec une clé vide.

Soit dit en passant, vous pouvez ajouter autant de messages que vous le souhaitez à une clé vide, de sorte que vous n’avez pas à combiner des chaînes pour afficher plusieurs messages.

Pour tous, si vous souhaitez collecter des messages d’erreur en un seul endroit, Pour Aucun, définissez dynamiquement lorsque vous ne souhaitez pas qu’un message d’erreur apparaisse pour quelque raison que ce soit. Il est bon de l’utiliser dans le but de.