{"id":55000134,"date":"2018-04-01T00:00:00","date_gmt":"2020-03-27T19:32:24","guid":{"rendered":"http:\/\/access-im-unternehmen.aix-dev.de\/aiu\/?p=134"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-30T00:00:00","slug":"ASPNET_Core_Validierung","status":"publish","type":"post","link":"https:\/\/vbentwickler.de\/ASPNET_Core_Validierung\/","title":{"rendered":"ASP.NET Core: Validierung"},"content":{"rendered":"

Genau wie in Desktop-Anwendung ist auch in Webanwendungen die Validierung der Benutzereingaben ein wichtiges Feature. Unter ASP.NET Core gibt es für die Razor Pages erfreulicherweise eine Standardvorgehensweise, die wir in diesem Artikel vorstellen werden. <\/b><\/p>\n

Vorbereitung<\/h2>\n

Für das Nachvollziehen der Beispiele in diesem Artikel legen Sie in Visual Studio 2017 ein neues Projekt namens Validierung an. Es wird mit der Projektvorlage VisualC#|Web|ASP.NET Core Webanwendung <\/b>erstellt. Im zweiten Vorlagendialog wählen Sie dann den Typ Webanwendung <\/b>aus. Wir wollen die Seite Pages\/Customers\/Create.cshtml <\/b>nutzen, um unsere Beispiele auszuprobieren. Diese wollen wir über einen neuen Menüeintrag der Webanwendung aufrufen, den wir in der Datei _Layout.cs <\/b>einfügen, und zwar an dieser Stelle:<\/p>\n

...\r\n<div class=\"navbar-collapse collapse\">\r\n     <ul class=\"nav navbar-nav\">\r\n         <li><a asp-page=\"\/Index\">Home<\/a><\/li>\r\n         <li><a asp-page=\"\/About\">About<\/a><\/li>\r\n         <li><a asp-page=\"\/Customers\/Create\">Neuer Kunde<\/a><\/li>\r\n     <\/ul>\r\n<\/div>\r\n...<\/pre>\n
Insgesamt werden wir neben Änderung der Datei _Layout.cs <\/b>noch zwei Dateien samt Verzeichnissen hinzufügen, nämlich Models\/Customer.cs <\/b>und Pages\/Customers\/Create.cshtml <\/b>(siehe Bild 1).<\/p>\n
\"Anlage<\/p>\n
Bild 1: Anlage einiger Verzeichnisse und Dateien<\/span><\/b><\/p>\n
Grundlagen<\/h2>\n
In Webanwendungen landen die Daten aus Tabellen zunächst in einem Objekt auf Basis einer Klasse, bevor diese auf einer Webseite dargestellt werden – diese Vorgehensweise kennen Sie ja auch schon von den Artikeln über den Einsatz des Entity Frameworks in Desktop-Anwendungen. Der Vorteil dieser Vorgehensweise ist, dass die Validierungsregeln nur an einer Stelle angelegt werden müssen und nicht etwa auf jeder Seite, welche die Eingabe oder Bearbeitung der Daten der betroffenen Klasse erlauben soll. Die Validierungsregeln werden hier wie da direkt in den Klassen angelegt, welche die Tabellen der Datenbank repräsentieren. Dazu legen wir zu Beispielzwecken diesmal keine Klasse auf Basis einer Tabelle an, sondern eine einfache Klasse ohne Bindung an eine Datenbank.<\/p>\n
Zu Beispielzwecken legen wir nun eine Klasse namens Customers.cs <\/b>an, und zwar in einem zuvor erstellten Verzeichnis namens Models direkt unterhalb des Projektordners. Dort wählen Sie dann den Kontextmenü-Eintrag Hinzufügen|Klasse… <\/b>aus und geben im nun erscheinenden Dialog Neues Element hinzufügen <\/b>den Namen für die Klasse ein – hier Customer.cs <\/b>(siehe Bild 2).<\/p>\n
\"Hinzufügen<\/p>\n
Bild 2: Hinzufügen einer Klasse zum Verwalten von Kunden<\/span><\/b><\/p>\n
Die Klassendatei mit der Klasse Customer<\/b> ergänzen wir nun wie in folgendem Code um einige Beispielfelder. Wozu das Feld namens Rating <\/b>dient Es hat einen bestimmten Zweck – außer als Beispiel für ein Decimal<\/b>-Feld …<\/p>\n
public class Customer {\r\n     public int ID { get; set; }\r\n     public string FirstName { get; set; }\r\n     public string LastName { get; set; }\r\n     public string Street { get; set; }\r\n     public string Zip { get; set; }\r\n     public string City { get; set; }\r\n     public string Email { get; set; }\r\n     public string Url{ get; set; }\r\n     public string Phone { get; set; }\r\n     public DateTime Birthday { get; set; }\r\n     public decimal Rating { get; set; }\r\n}<\/pre>\n
Wenn wir nun ein Formular auf Basis dieser Daten anlegen, sieht dies wie in gekürzter Form wie folgt aus:<\/p>\n
@page\r\n@model Validierung.Pages.Customers.CreateModel\r\n@{ ViewData[\"Title\"] = \"Create\"; }\r\n<h2>Datensatz erstellen<\/h2>\r\n<div class=\"row\">\r\n     <div class=\"col-md-4\">\r\n         <form method=\"post\">\r\n             <div asp-validation-summary=\"ModelOnly\" class=\"text-danger\"><\/div>\r\n             <div class=\"form-group\">\r\n                 <label class=\"control-label\">Vorname:<\/label>\r\n                 <input asp-for=\"Customer.FirstName\" class=\"form-control\" \/>\r\n                 <span asp-validation-for=\"Customer.FirstName\" class=\"text-danger\"><\/span>\r\n             <\/div>\r\n             ...\r\n             <div class=\"form-group\">\r\n                 <input type=\"submit\" value=\"Create\" class=\"btn btn-default\" \/>\r\n             <\/div>\r\n         <\/form>\r\n     <\/div>\r\n<\/div><\/pre>\n
Wir sehen hier im oberen Teil die Razor-Anweisungen, mit denen unter anderem die Klasse Validierung.Pages.Customers.CreateModel <\/b>als Modell referenziert wird. Darunter folgen einige Elemente samt form<\/b>-Element. Die für die Validierung wichtigen Elemente sind das Element mit dem Attribut asp-validation-summary <\/b>über den übrigen Elementen sowie das Element mit dem Attribut asp-validation-for <\/b>für jedes einzelne Steuer-element, das an eines der Felder der Modell-Klasse gebunden ist.<\/p>\n
Bevor wir auf diese eingehen, schauen wir uns noch an, wie wir die Klasse mit ein paar Validierungen ausstatten und wie das PageModel <\/b>und das Model für die Seite aussehen.<\/p>\n
Model der HTML-Seite<\/h2>\n
Die Code behind-Datei enthält den folgenden Code, unter anderem mit dem PageModel<\/b>:<\/p>\n
... weitere Namespace-Referenzen\r\nusing Validierung.Models;\r\nnamespace Validierung.Pages.Customers {\r\n     public class CreateModel : PageModel {\r\n         public IActionResult OnGet() {\r\n             return Page();\r\n         }\r\n         [BindProperty]\r\n         public Customer Customer { get; set; }\r\n         public IActionResult OnPost() {\r\n             if (!ModelState.IsValid) {\r\n                 return Page();\r\n             }\r\n             return RedirectToPage(\".\/Index\");\r\n         }\r\n     }\r\n}<\/pre>\n
Hier definieren wir einen Verweis auf das Verzeichnis Entitäten, also Validierung.Models<\/b>.  Dann fügen wir eine OnGet<\/b>-Methode ein, welche beim Aufruf die auf Basis von Create.cshtml <\/b>zusammengestellt Seite zurückliefert. Wir binden die Seite an die Klasse Customer <\/b>als Model. Dazu versehen wir die öffentliche Variable Customer <\/b>des Typs Customer <\/b>mit dem Attribut [BindProperty]<\/b>. Interessant ist die Methode OnPost<\/b>, die letztlich die Validierung ausführt – und zwar durch die Methode IsValid <\/b>des Objekts ModelState<\/b>. Liefert dieses nicht das Ergebnis True<\/b>, wird wieder die Seite mit dem zuvor ausgefüllten Formular zurückgeliefert. Erst wenn IsValid <\/b>den Wert True <\/b>liefert, zeigt die Webanwendung die dann vorgesehene Seite an – in diesem Fall die Index<\/b>-Seite. Das Objekt ModelState <\/b>ist übrigens ein Element des Namespaces Microsoft.AspNetCore.MVC<\/b>. Wenn die Methode IsValid <\/b>von ModelState <\/b>aufgerufen wird, untersucht die Webanwendung, ob die im Model Customer <\/b>festgelegten Validierungsregeln erfüllt sind. Diese müssen wir allerdings erst noch hinzufügen.<\/p>\n
Validierungsregeln in das Model einfügen<\/h2>\n
Um dem Model, also der Klasse Customer.cs<\/b>, die Validierungsregeln hinzuzufügen, müssen wir zunächst den Namespace System.ComponentModel.DataAnnotations <\/b>hinzufügen:<\/p>\n
using System.ComponentModel.DataAnnotations;<\/pre>\n
Validierungsregel für Pflichtangaben<\/h2>\n
Die meistgenutzte Validierungsregel dürfte die sein, die prüft, ob erforderliche Werte angegeben wurden. Um ein Feld in der Klasse Customer <\/b>mit dieser Validierungsregel zu belegen, fügen wir vor dem jeweiligen Feld die Data Annotation namens Requery <\/b>ein – hier an einigen Beispielen zu sehen:<\/p>\n
public class Customer {\r\n     public int ID { get; set; }\r\n     [Required]\r\n     public string FirstName { get; set; }\r\n     [Required]\r\n     public string LastName { get; set; }\r\n     [Required]\r\n     public string Street { get; set; }\r\n     ...\r\n}<\/pre>\n
Wenn wir die Anwendung nun starten, über den Menüeintrag Neuer Kunde <\/b>zur Seite Create.cshtml <\/b>wechseln und dort direkt auf die Schaltfläche mit der Beschriftung Create <\/b>klicken, erhalten wir die Validierungsmeldungen aus Bild 3. Es klappt also alles wie gewünscht. Nun schauen wir uns weitere Möglichkeiten an.<\/p>\n
\"Validierungsmeldungen\"<\/p>\n
Bild 3: Validierungsmeldungen<\/span><\/b><\/p>\n
Tag Helper für die Validierung<\/h2>\n
Bei asp-validation-summary <\/b>und asp-validation-for <\/b>handelt es sich um sogenannte Tag-Helper (mehr Tag-Helper stellen wir im Artikel ASP.NET Core: Tag Helper <\/b>vor). Der Tag Helper asp-validation-summary <\/b>wird in der Regel einmal oberhalb eines Formulars angegeben. Dort hat er die Aufgabe, eventuell auftretende Validierungshinweise auszugeben, die nicht nur ein spezielles Feld betreffen, sondern mehrere Felder oder allgemeine Hinweise. Für dieses Attribut gibt es drei mögliche Werte:<\/p>\n