Páginas web ASP.NET - Formularios HTML
Un formulario es una sección de un documento HTML donde coloca controles de entrada (cuadros de texto, casillas de verificación, botones de radio y listas desplegables).
Creación de una página de entrada HTML
Ejemplo de navaja
<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>
Ejemplo de Razor - Visualización de imágenes
Suponga que tiene 3 imágenes en su carpeta de imágenes y desea mostrar imágenes dinámicamente según la elección de los usuarios.
Esto se hace fácilmente con un pequeño código Razor.
Si tiene una imagen llamada "Foto1.jpg" en su carpeta de imágenes en su sitio web, puede mostrar la imagen usando un elemento HTML <img> como este:
<img src="images/Photo1.jpg" alt="Sample" />
El siguiente ejemplo muestra cómo mostrar una imagen seleccionada que el usuario selecciona de una lista desplegable:
Ejemplo de navaja
@{
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>
Ejemplo explicado
El servidor crea una variable llamada imagePath .
La página HTML tiene una lista desplegable (un elemento <select>) denominada Choice . Permite al usuario seleccionar un nombre descriptivo (como Foto 1 ) y pasa un nombre de archivo (como Foto1.jpg ) cuando la página se envía al servidor web.
El código Razor lee el valor de Choice by Request["Choice"] . Si tiene un valor, el código construye una ruta a la imagen images/Photo1.jpg y la almacena en la variable imagePath .
En la página HTML hay un elemento <img> para mostrar la imagen. El atributo src se establece en el valor de la variable imagePath cuando se muestra la página.
El elemento <img> está en un bloque if para evitar intentar mostrar una imagen sin nombre (como la primera vez que se muestra la página).