ASP.NET Webseiten - HTML-Formular

Das Formular (Datenblatt) ist der Ort, an dem Sie Eingabekontrollen (Textfelder, Kontrollkästchen, Radiofelder und Dropdown-Listen) in Ihrem HTML-Dokument platzieren.

Erstellen Sie eine HTML-Eingabeseite

Razor-Instanz

<html>
<body> 
@{
if (IsPost) { 
string companyname = Request["companyname"]; 
string contactname = Request["contactname"]; 
<p> Sie haben eingegeben: <br />
Firmenname: @companyname <br />
Kontaktname: @contactname </p>
}
else
{
<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="Einreichen" class="submit" />
</form>
}
} 
</body> 
</html>

Laufendes Beispiel

Razor-Instanz - Bildanzeige

Angenommen, es gibt drei Bilder in Ihrem Bildordner, und Sie möchten diese nach der Auswahl des Benutzers dynamisch anzeigen.

Das ist mit einem kurzen Abschnitt von Razor einfach zu erreichen.

Wenn der Name des Bildes in dem Ordner der Website-Bilder "Photo1.jpg" ist, können Sie das Bild mit dem HTML-Element <img> anzeigen, wie folgt:

<img src="images/Photo1.jpg" alt="Vorschau" />

Das folgende Beispiel zeigt, wie man ein Bild anzeigt, das der Benutzer aus einer Dropdown-Liste ausgewählt hat:

Razor-Instanz

@{
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">Photo 1</option> 
  <option value="Photo2.jpg">Photo 2</option> 
  <option value="Photo3.jpg">Photo 3</option> 
</select> 
<input type="submit" value="Submit" /> 
@if (imagePath != "")
{
<p>
<img src="@imagePath" alt="Sample" />
</p>
}  
</form> 
</body> 
</html>

Laufendes Beispiel

Beispiel erläutert

Der Server erstellt eine Variable mit dem Namen imagePath 。

Die HTML-Seite enthält eine Variable mit dem Namen Choice desDropdown-Liste（<select>-Element）。Es ermöglicht dem Benutzer, einen freundlichen (Anmerkung des Herausgebers: leicht lesbaren) Namen (z.B. Photo 1），wenn die Seite an den Webserver gesendet wird, wird der Dateiname (z.B. Photo1.jpg) an den Server übermittelt.

Razor über Request["Choice"] Den Wert von Choice lesen. Wenn der Wert existiert, konstruiert der Code den Pfad zum Bild (images/Photo1.jpg) und speichert den Pfad in der Variable imagePath 。

Das <img>-Element im HTML-Dokument zeigt dieses Bild an. Wenn die Seite angezeigt wird, wird das src-Attribut auf den Wert der Variable imagePath gesetzt.

Wenn der Wert der Variable imagePath leer ist, wird verhindert, dass das <img>-Element ein nicht vorhandenes Bild anzeigt (z.B. beim ersten Laden der Seite).