Die Eingabeüberprüfung setzt bei ASP.NET Razor auf Jquery Validation. Entsprechend müssen die beiden JavaScript Bibliotheken Validation und unobtrusive irgendwie eingebunden werden. In einem ASP.NET Core 3 Projekt ist das die Datei _Layout.cshtml im Ordner Pages/ Shared.
1: <script src="~/lib/jquery-validation/dist/jquery.validate.js"></script>
2: <script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js"></script>
Ich bin kein großer Freund dieser Bibliothek. Bisher ungelöste Probleme im Bereich Internationalisierung auf der Client Seite.
Dies aber alle kein Thema in diesem Blog Artikel. Auch werden Basiscs des ASP.NET Core Model Binding nicht erläutert. Für das Model wird eine Klasse bzw die Eigenschaft mit einem Attribut Remote versehen.
1: public class ToDo
2: {
3: [Key]
4: public int ID { get; set; }
5: public string Aufgabe { get; set; }
6: private string _User;
7: [Remote(action: "MyMethod", controller:"My", ErrorMessage = "alles falsch")]
8: public string User
9: {
10: get { return _User; }
11: set { _User = value; }
12: }
Hier kann nur ein Controller als Valdierungseinstiegspunkt angegeben werden. Der Ajax Callback lautet dann auf MyController/MyMethod
Entsprechend muss im Unterverzeichnis Controller ein neuer Controller MyController.cs angelegt werden. Der Name des gebundenen Models muss als (nicht case sensitiv) Parameter angeben werden, anderenfalls das automatische Binding nicht funktioniert.
1: public class MyController : Controller
2: {
3: [AcceptVerbs("Get", "Post")]
4:
5: public IActionResult MyMethod(ToDo Mytodo) //Name wichtig, groß kleinschreibung egal
6: {
7: if (Mytodo.User.Contains("x"))
8: {
9:
10: return Json("Invalid X User");
11: }
12: return Json(true);
13:
14: }
15: }
Allerdings wird so unter dotnetcore 3 eine Fehlermeldung im Browser erscheinen.
InvalidOperationException: No URL for remote validation could be found.
Es fehlt noch an der passenden Route um den Controller auch zu finden. Anders als bei ASP.NET Core 2.2 wird nicht UseMVc in der startup.cs eingefügt, sondern ein Endpoint definiert.
1: app.UseEndpoints(endpoints =>
2: {
3: endpoints.MapRazorPages();
4: endpoints.MapControllerRoute("default", "{controller=Home}/{action=Index}/{id?}");
5: });
6:
Das ViewModel vom Typ ToDo wird als Property dem Razor View hinzugefügt um es im View binden zu können.
1: [BindProperty]
2: public ToDo MyToDo { get; set; } = new ToDo();
Letztendlich fehlt noch die HTML Definition des cshtml Razor Formulars mit gebundenen Eingabefehlern
1: <form method="post">
2: <table cellpadding="10" border="1">
3: <tr>
4: <td>
5: <label asp-for="MyToDo.ID">ToDO ID :</label>
6: </td>
7: <td>
8: <input type="text" asp-for="MyToDo.ID" />
9: <span asp-validation-for="MyToDo.ID" class="error">
10: </span>
11: </td>
12: </tr>
13: <tr>
14: <td>
15: <label asp-for="MyToDo.User">User:</label>
16: </td>
17: <td>
18: <input type="text" asp-for="MyToDo.User" />
19: <span asp-validation-for="MyToDo.User" class="error">
20: </span>
21: </td>
22: </tr>
23: <tr>
24: <td> <input type="submit" value="Save" /></td>