3.6 Formularios

Hasta ahora hemos visto la forma en la que el HTML gestiona y muestra la información, esencialmente mediante texto, imágenes, listas, tablas y enlaces. Nos queda por ver de qué forma podemos intercambiar información con el usuario.

Hoy en día, este nuevo aspecto resulta primordial para gran cantidad de acciones que se pueden llevar a cabo mediante el Web: Comprar un artículo, rellenar una encuesta, enviar un comentario al autor….hablamos de los formularios, ¡seguro que los usas a diario!

¿Qué es un formulario?

Un formulario es una caja de texto y botones que podemos encontrar en muchas páginas web. Son muy utilizados para realizar búsquedas o bien para introducir datos personales por ejemplo en sitios de comercio electrónico. Los datos que el usuario introduce en estos campos son enviados al correo electrónico del administrador del formulario o bien a un programa que se encarga de procesarlo automáticamente.

La etiqueta <form> encierra todos los elementos de un formulario que pueden ser botones, listas desplegables, cuadros de texto, etc, también conocidos como “campos de formulario”.

Existen una serie de atributos propios del formulario que determinan su funcionalidad, destacando action = "url" - Indica la URL que se encarga de procesar los datos del formulario.

El elemento más importante del formulario es <input> , y tiene distintas variaciones dependiendo del tipo de atributo. A continuación se detallan los más importantes:

• <input type="text"> : define un campo para introducir texto.
• <input type="password"> igual al anterior salvo que los caracteres se enmascaran por asteriscos o círculos.
• <input type="radio"> define un botón de tipo radio que solo permite elegir una de las opciones.
• <input type="checkbox"> define una serie de casillas pudiendo elegir desde cero a más opciones.
• <input type="date"> en HTML5 muestra el icono del mapa como forma de introducir la fecha.
• <input type="email" name="email"> en HTML5 valida que hemos escrito el email siguiendo el patrón correcto.
• <input type="submit">: define un botón que permite enviar a la página especificada en el action todos los valores recogidos en el formulario por los distintos campos.