ASP.NET-webpagina's - HTML-formulieren
Een formulier is een sectie van een HTML-document waarin u invoerbesturingselementen (tekstvakken, selectievakjes, keuzerondjes en vervolgkeuzelijsten) plaatst.
Een HTML-invoerpagina maken
Scheermes Voorbeeld
<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>
Scheermes Voorbeeld - Afbeeldingen weergeven
Stel dat u 3 afbeeldingen in uw afbeeldingenmap heeft en u wilt afbeeldingen dynamisch weergeven volgens de keuze van de gebruiker.
Dit is eenvoudig te doen door een kleine Razor-code.
Als u een afbeelding met de naam "Photo1.jpg" in uw afbeeldingenmap op uw website heeft, kunt u de afbeelding weergeven met een HTML <img>-element zoals dit:
<img src="images/Photo1.jpg" alt="Sample" />
Het onderstaande voorbeeld laat zien hoe u een geselecteerde afbeelding kunt weergeven die de gebruiker selecteert in een vervolgkeuzelijst:
Scheermes Voorbeeld
@{
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>
Voorbeeld uitgelegd
De server maakt een variabele met de naam imagePath aan .
De HTML -pagina heeft een vervolgkeuzelijst (een <select>-element) met de naam Keuze . Het laat de gebruiker een beschrijvende naam selecteren (zoals Foto 1 ) en geeft een bestandsnaam door (zoals Foto1.jpg ) wanneer de pagina naar de webserver wordt verzonden.
De Razor-code leest de waarde van Choice by Request["Choice"] . Als het een waarde heeft, construeert de code een pad naar de afbeelding images/Photo1.jpg en slaat het op in de variabele imagePath .
In de HTML-pagina is er een <img>-element om de afbeelding weer te geven. Het src-attribuut wordt ingesteld op de waarde van de imagePath-variabele wanneer de pagina wordt weergegeven.
Het <img>-element bevindt zich in een if-blok om te voorkomen dat wordt geprobeerd een afbeelding zonder naam weer te geven (zoals de eerste keer dat de pagina wordt weergegeven).