Formulario web
Un formulario web é unha agrupación de elementos creados coa linguaxe HTML/XHTML, que permite a un usuario interactuar cunha páxina web, enviando e procesando información. Componse de etiquetas de texto e campos, nos que se pode introducir a información, que logo será enviada e procesada.
Índice |
Obxectos [editar]
Un formulario web está contido entre as etiquetas HTML <form> e </form>. Entre as devanditas etiquetas están definidos os campos e etiquetas que permiten introducir a información. Os tipos de campos dispoñibles son os seguintes:
Campo de texto [editar]
Permite ao usuario introducir un texto nunha liña. Utilízase para introducir datos con contido limitado (ex.: Nome). A sintaxe na linguaxe HTML é a seguinte:
Nome: <input type="text" name="nome">
Neste exemplo, amosarase unha etiqueta de texto Nome:, seguida dun campo de texto no que se poderá introducir o dato.
Campo contrasinal [editar]
É igual ca o Campo de texto, pero mentres se escribe amosa asteriscos ou puntos para ocultar a información que se está a escribir.
Contrasinal: <input type="password" name="Contrasinal">
Casilla de selección (checkbox en inglés) [editar]
Permite ao usuario facer seleccións múltiples facendo clic sobre as casillas predefinidas
Selecciona as tuas aficións:<br>
<INPUT type="checkbox" name="aficions" value="Lectura"> Lectura<br>
<INPUT type="checkbox" name="aficions" value="Música"> Música<br>
<INPUT type="checkbox" name="aficions" value="Xogos"> Xogos<br>
<INPUT type="checkbox" name="aficions" value="Internet"> Internet<br>
Neste exemplo, o formulario permitirá seleccionar unha ou máis aficións de entre as predefinidas
Botón de Opcións [editar]
Permite ao usuario facer unha selección co rato, de entre as que están predefinidas:
Selecciona un xeito de pagamento:<br>
<INPUT type="radio" name="pagamento" value="Transferencia"> Transferencia<br>
<INPUT type="radio" name="pagamento" value="Tarxeta de crédito"> Tarxeta de crédito<br>
<INPUT type="radio" name="pagamento" value="Contrareembolso"> Contrareembolso<br>
No exemplo anterior, o formulario amosará os tres xeitos de pagamento predefinidos, e permitirá seleccionar un de eles
Selector de arquivo [editar]
Permite seleccionar un ficheiro (ruta) do ordenador local, a través dun botón examinar, que logo será subido a un servidor.
<input type="file" name="arquivo">
Amosará un selector de ficheiro cun botón examinar que abrirá o selector de ficheiros/carpetas locais do ordenador.
Botón Reset [editar]
Facendo click sobre o mesmo, bórranse os datos introducidos previamente en calquera campo do formulario web.
<input type="reset" value="Borrar">
Amosará un botón que borrará todolos datos introducidos no formulario.
Botón enviar [editar]
Envía/procesa os datos introducidos no formulario:
<input type="submit" value="Enviar">
Amosará un botón que enviará o formulario.
Área de texto [editar]
Permite ao usuario introducir un texto en varias liñas. Utilízase para introducir datos de texto con contido máis extenso (ex.: Comentarios).
Comentarios:<br>
<TEXTAREA NAME="comentarios" cols=40 rows=6></TEXTAREA>
Esta área de texto terá 40 caracteres de largura e 6 filas de altura. Permitirá introducir un texto de varias liñas.
Lista de selección [editar]
Permite seleccionar un ou varios valores dunha lista previamente definida, a través dun selector despregable.
Provincia:
<SELECT NAME="Provincia">
<OPTION VALUE="CO">A Coruña</OPTION>
<OPTION VALUE="LU">Lugo</OPTION>
<OPTION VALUE="OU">Ourense</OPTION>
<OPTION VALUE="PO">Pontevedra</OPTION>
</SELECT>
Neste exemplo, permitirá seleccionar dunha lista desplegable unha das provincias galegas.
Exemplo do código HTML dun formulario completo [editar]
<html> <head> <title>Formulario web</title> </head> <body> <form action="#" method="post"> Nome: <input type="text" name="nome"><br><br> Contrasinal: <input type="password" name="Contrasinal"><br><br> Selecciona as tuas aficións:<br> <INPUT type="checkbox" name="aficions" value="Lectura"> Lectura<br> <INPUT type="checkbox" name="aficions" value="Música"> Música<br> <INPUT type="checkbox" name="aficions" value="Xogos"> Xogos<br> <INPUT type="checkbox" name="aficions" value="Internet"> Internet<br><br> Selecciona un xeito de pagamento:<br> <INPUT type="radio" name="pagamento" value="Transferencia"> Transferencia<br> <INPUT type="radio" name="pagamento" value="Tarxeta de crédito"> Tarxeta de crédito<br> <INPUT type="radio" name="pagamento" value="Contrareembolso"> Contrareembolso<br><br> Comentarios:<br> <TEXTAREA NAME="comentarios" cols=30 rows=6></TEXTAREA><br><br> Provincia: <SELECT NAME="Provincia"> <OPTION VALUE="CO">A Coruña</OPTION> <OPTION VALUE="LU">Lugo</OPTION> <OPTION VALUE="OU">Ourense</OPTION> <OPTION VALUE="PO">Pontevedra</OPTION> </SELECT><br><br> <input type="submit" value="Enviar"> <input type="reset" value="Borrar"> </form> </body> </html>
Envío e procesamento dos formularios [editar]
Os datos introducidos nun formulario web, poden ser enviados e procesados por un servidor, indicando no atributo action da etiqueta <FORM>, a URL do devandito servidor seguida dun arquivo que conteña o código que procesará o formulario, escrito nunha linguaxe de servidor (PHP, JSP, ASP ...). Exemplo: <FORM action="http://url_servidor/procesa_formulario.php">.
O procesamento, independentemente da linguaxe de servidor empregada, pódese facer basicamente de dúas formas:
- Envío dos datos por correo electrónico. O formulario ten asignado un enderezo de correo electrónico, e cando se procesa, os datos son enviados a dito enderezo
- Rexistro dos datos nunha base de datos, a partir da que poden ser procesados con posterioridade.
