In diesem Abschnitt wird Ihnen das HTML-Formular von ASP.NET WebPages erklärt.
Ein Formular ist der Teil eines HTML-Dokuments, in dem Eingabesteuerelemente (Textfelder, Kontrollkästchen, Optionsfelder, Dropdown-Listen) platziert werden.
Razor-Instanz
<html> <body> @{if (IsPost) { string companyname = Request["companyname"]; <p>Sie haben Folgendes eingegeben: <br /> Firmenname: @companyname <br /> Kontaktname: @contactname </p>}sonst{ <form method="post" action=""> Firmenname:<br /> <input type="text" name="CompanyName" value="" /><br /> Kontaktname:<br /> <input type="text" name="ContactName" value="" /><br /><br /> <input type="submit" value="Submit" /> </form> } } </body> </html>
Angenommen, Sie haben drei Bilder in Ihrem Bilderordner und möchten die Bilder basierend auf der Auswahl des Benutzers dynamisch anzeigen.
Dies kann mit einem einfachen Stück Razor-Code erreicht werden.
Wenn Sie im Bilderordner Ihrer Website ein Bild mit dem Namen „Photo1.jpg“ haben, können Sie das HTML-Element <img> verwenden, um das Bild anzuzeigen, wie unten gezeigt:
<img src="images/Photo1.jpg" />
Das folgende Beispiel zeigt, wie ein vom Benutzer aus der folgenden Liste ausgewähltes Bild angezeigt wird:
@{var imagePath=""; if (Request["Choice"] != null){imagePath="images/" + Request["Choice"];} } <!DOCTYPE html> <html> <body> <h1>Bilder anzeigen</h1> <form method="post" action=""> Ich möchte sehen: <select name="Choice"> <option value=" Photo1.jpg">Foto 1</option> <option value="Photo2.jpg">Foto 2</option> <option value="Photo3.jpg">Foto 3</option> </select> <input type="submit" value="Submit" /> @if (imagePath != ""){ <p> <img src="@imagePath " /> </p>} </form> </body> </html>Der Server erstellt eine Variable namens imagePath .
Die HTML-Seite verfügt über eine Dropdown-Liste (Element <select>) mit dem Namen Choice . Es ermöglicht dem Benutzer, einen Namen nach seinen eigenen Wünschen zu wählen (z. B. Foto 1 ), und wenn die Seite an den Webserver übermittelt wird, wird ein Dateiname (z. B. Foto1.jpg ) übergeben.
Razor-Code liest den Wert von Choice über Request["Choice"] . Wenn der durch Code erstellte Bildpfad (images/Photo1.jpg) gültig ist, weisen Sie den Bildpfad der Variablen imagePath zu.
In HTML-Seiten wird das <img>-Element zum Anzeigen von Bildern verwendet. Wenn die Seite angezeigt wird, wird das src-Attribut verwendet, um den Wert der imagePath-Variablen festzulegen.
Das <img>-Element befindet sich in einem if-Block. Dies soll verhindern, dass das Bild ohne Namen angezeigt wird, beispielsweise wenn die Seite zum ersten Mal geladen wird.