aIn folgenden Self Study Lab wird ein einfacher Taschenrechner mit ASP.NET Core und Razor View Engine erstellt. Es wird dafür ein Visual Studio 2017 ASP.NET dotnet core 2.1 Projekt benötigt. Im Verzeichnis Pages wird eine Razor Seite Calc hinzugefügt. Diese enthält eine PageModel Klasse um aus dem C# Code Felder in den HTML View mischen zu können.
Die so erzeugte calc.cshtml Datei wird im Visual Studio Editor ergänzt um folgenden HTML Code. Achten Sie auf darauf statt ID das Atrribut Name zu verwenden. Sonst wird im http Post der Wert nicht an den Server gesendet.
1: <form method="post">
2: <input name="wert1" type="text" /><br />
3: <input name="wert2" type="text" /><br />
4: <input id="Submit1" type="submit" value="plus" />
5: <hr />
6: <div>@Model.result</div>
7: </form>
Im Code Behind, also der Datei calc.cshtml.cs wird aus der OnGet Methode die OnPost gemacht. Diese wird je nach verwendeten HTTP Verb aufgerufen. Ein Form Post wird durch den Submit Button bewirkt. Die Objekte Response und Request enthalten Eigenschaften über die man auf Details zugreifen kann. Per Form und den Namen des HTML Input Elements auf den Inhalt der Textbox.
Das Ergebnis wird berechnet und dem Property Result zugewiesen.
1: public double result { get; set; }
2: public void OnPost()
3: {
4: string wert1 = Request.Form["wert1"];
5: string wert2 = Request.Form["wert2"];
6: result = double.Parse( wert1) + double.Parse(wert2);
7: }
Da Result nun Bestandteil des Pagemodels ist, kann im HTML View mit dem @ Zeichen und dem Schlüsselwort Model nach dem MVC Pattern die Ausgabe in der HTML Page gerendert werden. Starten Sie die Webanwendung in Visual Studio Projekt mit F5 und geben Sie zweit Werte in die Textboxen ein.
Im Gegensatz zu z.B. Webforms sind die Input Felder nach einem Postback leer.