Formulaires de pages Web
Pages Web ASP.NET - Formulaire HTML
Un formulaire est un document HTML qui place des contrôles de saisie (zones de texte, cases à cocher, radio boutons d'options, listes déroulantes).
Créer une page de saisie HTML
Instance Razor
<!DOCTYPE html>
<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><br>
<input type="text" name="ContactName" value=""><br><br>
<input type="submit" value="Submit" class="submit">
</form>
}
}
</body>
</html>Exécuter l'instance»
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne
Instance Razor - Afficher les images
Supposons qu'il y ait 3 images dans votre dossier d'images que vous souhaitez pour afficher les images de manière dynamique en fonction des sélections de l'utilisateur.
Cela peut être réalisé avec un simple morceau de code Razor.
Si vous avez une image nommée "Photo1.jpg" dans le dossier images de votre site Web, vous pouvez utiliser l'élément HTML <img> pour afficher l'image, comme ceci :
L'exemple suivant montre comment afficher l'utilisateur dans la liste suivante Image sélectionnée dans :
Instance
@{
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="Pic1.jpg">Photo 1</option>
<option value="Pic2.jpg">Photo 2</option>
<option value="Pic3.jpg">Photo 3</option>
</select>
<input type="submit" value="Submit">
@if(imagePath != "")
{
<p>
<img src="@imagePath" alt="Sample">
</p>
}
</form>
</body>
</html>Exécuter l'instance»
Cliquez sur le bouton "Exécuter l'instance" pour afficher l'instance en ligne
Explication des exemples
Le serveur crée une variable appelée imagePath. La
page HTML comporte une liste déroulante (élément <select>) nommée Choix. Il permet à l'utilisateur de choisir un nom de son choix (par exemple Photo 1) et lorsque la page est soumise au serveur Web, un nom de fichier est transmis (par exemple Photo1.jpg) .
Le code Razor lit la valeur de Choice via Request["Choice"]. Si le chemin de l'image (images/Photo1.jpg) construit via le code est valide, attribuez le chemin de l'image à la variable imagePath.
Dans les pages HTML, l'élément <img> L'attribut src est utilisé pour définir la valeur de la variable imagePath lorsque la page est affichée. L'élément
<img> est à l'intérieur d'un bloc if. Cela permet d'éviter que l'image ne soit affichée sans nom, par exemple lors du premier chargement de la page.
