Heim > Artikel > Backend-Entwicklung > Teilen Sie ASP.NET-Studiennotizen (6) WebPages-Formular

Teilen Sie ASP.NET-Studiennotizen (6) WebPages-Formular

零下一度Original: 2017-05-25 09:16:191384Durchsuche

Ein Formular ist der Teil eines HTML-Dokuments, in dem Eingabesteuerelemente (Textfelder, Kontrollkästchen, Optionsfelder, Dropdown-Listen) platziert werden.

HTML-Eingabeseite erstellen

Razor Instanz

<html>
<body> 
@{
if (IsPost) { 
string companyname = Request["companyname"]; 
string contactname = Request["contactname"]; 
<p>You entered: <br />
Company Name: @companyname <br />
Contact Name: @contactname </p>
}
else
{
<form method="post" action="">
Company Name:<br />
<input type="text" name="CompanyName" value="" /><br />
Contact Name:<br />
<input type="text" name="ContactName" value="" /><br /><br />
<input type="submit" value="Submit" class="submit" />
</form>
}
} 
</body> 
</html>

Razor-Instanz – Bild anzeigen

Übernehmen in Sie haben 3 Bilder in Ihrem Bilderordner und möchten die Bilder dynamisch basierend auf der Auswahl des Benutzers anzeigen.

Dies kann mit einem einfachen Stück Razor-Code erreicht werden.

Wenn Sie ein Bild mit dem Namen „Photo1.jpg“ im Bilderordner Ihrer Website haben, können Sie das HTML-Element a1f02c36ba31691bcfe87b2722de723b verwenden, um das Bild anzuzeigen:

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

Das folgende Beispiel zeigt, wie ein vom Benutzer aus der folgenden Liste ausgewähltes Bild angezeigt wird:

Razor-Instanz

@{var imagePath=""; if (Request["Choice"] != null){imagePath="images/" + Request["Choice"];} } <!DOCTYPE html> <html> <body> <h1>Display Images</h1> <form method="post" action=""> I want to see: <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>

Instanzerklärung

Server hat ein Variable namens imagePath.

Die HTML-Seite verfügt über eine Dropdown-Liste mit dem Namen „Choice“ (221f08282418e2996498697df914ce4e-Element). Es ermöglicht dem Benutzer, einen Namen seiner Wahl zu wählen (z. B. Foto 1), und wenn die Seite an den Webserver übermittelt wird, wird ein Dateiname übergeben (z. B. Foto1.jpg).

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 a1f02c36ba31691bcfe87b2722de723b-Element verwendet, um Bilder anzuzeigen. Das src-Attribut wird verwendet, um den Wert der imagePath-Variablen festzulegen, wenn die Seite angezeigt wird. Das

a1f02c36ba31691bcfe87b2722de723b-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.

[Verwandte Empfehlungen]

Kostenloses ASP.NET-Video-Tutorial

2. Teilen Sie ASP.NET-Studiennotizen (1) --WebPages Razor

ASP.NET-Studiennotizen teilen (2)--WebPages-Einführung

4 Notizen (3) Webseiten-Layout

5. ASP.NET-Lernnotizen teilen (4) Ordner

6.ASP.NET-Lernnotizen teilen (5) Globale Seite AppStart und PageStart

Das obige ist der detaillierte Inhalt vonTeilen Sie ASP.NET-Studiennotizen (6) WebPages-Formular. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Teilen Sie ASP.NET-Studiennotizen (5) Globale Seite AppStart und PageStartNächster Artikel：Teilen Sie ASP.NET-Studiennotizen (5) Globale Seite AppStart und PageStart

In Verbindung stehende Artikel

Mehr sehen