Derniers tutoriels de développement web
 

ASP.NET Pages Web - Formulaires HTML


Un formulaire est une partie d'un document HTML où vous mettez les commandes d'entrée (text boxes, check boxes, radio buttons, and pull-down lists) des (text boxes, check boxes, radio buttons, and pull-down lists)


Création d'une page HTML d'entrée

Razor Exemple

<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>
»Exécuter exemple

Razor Exemple - Affichage des images

Supposons que vous avez 3 images dans votre dossier d'image, et que vous voulez afficher des images dynamiquement par le choix des utilisateurs.

Cela se fait facilement par un petit Razor code.

Si vous avez une image appelée "Photo1.jpg" dans votre dossier d'images sur votre site web, vous pouvez afficher l'image en utilisant un fichier HTML <img> élément comme celui - ci:

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

L'exemple ci-dessous montre comment afficher une image sélectionnée que l'utilisateur sélectionne dans une liste déroulante:

Razor Exemple

@{
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>
»Exécuter exemple

exemple expliqué

Le serveur crée une variable appelée imagePath .

La page HTML a une drop-down list (a <select> element) nommé Choice . Il permet à l'utilisateur de sélectionner un nom convivial (like Photo 1 ) la (like Photo1.jpg ) (like Photo 1 ) , et passe un nom de fichier (like Photo1.jpg ) lorsque la page est envoyée au serveur Web.

Le Razor code lit la valeur de choix par Request["Choice"] . Si elle a une valeur du code construit un chemin vers l'image (images / Photo1.jpg, et le stocke dans la variable imagePath .

Dans la page HTML il y a un <img> élément pour afficher l'image. Le src attribut est défini sur la valeur de la variable imagePath lorsque le affichage de la page.

Le <img> élément est dans un si bloc pour empêcher d' essayer d'afficher une image sans nom (comme la première fois que la page est affichée.