| Artículos | 01 SEP 1997

Formularios sencillos en páginas Web

Tags: Histórico
Jaime Peña.

Los formularios son el modo más habitual de recabar e intercambiar información con los usuarios en un documento HTML.

Los documentos HTML nos brindan muchas posibilidades, algunas ya comentadas en artículos anteriores, tales como hojas de estilo (style sheets), marcos (frames) o tablas. En el presente artículo, trataremos algo que estamos muy acostumbrados a ver y que también podremos incluir, con más facilidad de lo que parece, en nuestras páginas: los formularios.

La programación de formularios puede ser todo lo complicada que deseemos. En la práctica, cuando se procesan grandes volúmenes de información, o cuando se quiere procesar ésta y remitir respuestas a los usuarios, precisaremos realizar tareas de programación. La interfaz de programación es un estándar bien definido y se denomina CGI (Common Gateway Interface). Aprender a programar aplicaciones CGI es algo que requiere un tratamiento algo profundo, no abordable en un artículo de las dimensiones del presente.

Pero, sin eso, también es factible sacar partido de los formularios; no lograremos una interactividad real, pero sí tendremos la oportunidad de recibir informaciones de los usuarios de nuestras páginas personales. En este sentido enfocaremos en presente artículo, reconociendo las limitaciones de este método, pero con la ventaja de no tener que aprender CGI.

Visión general de los formularios

Un formulario es algo muy similar a lo que está habituado a encontrarse en una caja de diálogo de su sistema operativo. Mediante él se proponen selecciones o áreas de edición, que Usted tendrá la oportunidad de escoger y/o rellenar; tras lo cual las enviará al servidor. Típicamente, constará de controles (áreas de edición de textos, botones de selección, listas y demás) y un botón de comando de envío. La definición de un formulario se realiza en el cuerpo del documento, entre los tags de inicio y fin .... Para situarlo en un lugar de la página en concreto, deberá utilizar la secuenciación de tags común en un documento HTML; es decir, aparecerá como si de otra información textual, tabular o gráfica se tratase, en el orden en que se incluya.

Los identificadores o tags básicos para crear el archivo base, que contiene un formulario, son los siguientes. En primer lugar,

...
delimita el contenido de un formulario. Aquí es donde podremos poner textos explicativos, etiquetas de controles y los propios controles de entradas de datos y botones de comando. En segundo lugar, define un tipo de entrada de datos de usuario. Cada control se explicitará como un . Más adelante veremos cuáles son los posibles controles y los modificadores de este tag genérico de entradas de usuario.

Por tanto, una estructura básica, algo así como una maqueta de partida, bien podría ser semejante a:

ACTION="mailto:personal@mail.es">

Su nombre es:

NAME="nombre"

VALUE="Su nombre">


Su dirección e-mail es:

NAME="email"

VALUE="Dirección e-mail">


NAME="Enviar"

VALUE="Enviar">

Este sencillo formulario, propondrá un par de cajas de textos, para que se escriban el nombre y la dirección e-mail del cliente. La información, se remitirá al servidor al hacer clic sobre el botón Enviar.

Métodos y acciones

Habrá observado en el breve listado anterior, que el tag de definición de formularios contiene los modificadores METHOD y ACTION. Son parte muy importante del proceso de interactividad y nunca faltan en la declaración. Veamos su significado y misión (téngase presente el listado de la Figura 1). El modificador METHOD puede tener los valores POST o GET. Define el modo en que, internamente, el servidor de Internet envía la información del formulario. En casi todos los casos va bien el método POST, por lo que aconsejamos inicie sus formularios proponiendo:

y si su servidor no le remite la información, o lo hace de manera irregular (indescifrable) lo cambie a:

El modificador ACTION="URL" indicará que acciones se tomarán con los datos pasados al formulario, llamando a una dirección URL (sea un programa en un servidor, sea una dirección de correo electrónico). Habitualmente se procesarán en un programa externo acorde con el estándar CGI (Common Gateway Interface), programado en Perl, C, Delphi, Visual Basic, etc.. El cómo hacerlo requiere conocimientos de CGI y del lenguaje en concreto, por lo que en este artículo no entraremos en detalles de su forma. Para requerimientos más simples y siempre que utilice Netscape Navigator, puede indicar que se le remitan por e-mail los datos recabados. En tal caso, escribiríamos algo así como:

ACTION="mailto:personal @mail.es"

en el que personal@mail.es sería su dirección de correo electrónico. Para páginas personales, en las que no se quiera una complicación adicional, es un excelente método de recabar información y en ese sentido, nos apoyaremos en esto para ilustrar los ejemplos del presente artículo. Obviamente, recuerde que sólo los que estén usando Netscape Navigator podrían remitirle las respuestas del formulario. Los que usen Microsoft Internet Explorer, verán que se desplegaría una ventana de redacción de correo electrónico y no enviarían las respuestas del formulario de manera automática.

Si está conectado a Internet, puede comprobar el funcionamiento de su formularios, mediante una llamada a un foro público del NCSA, que devolverá la información seleccionada. Utilice para ello la acción:

ACTION="http://hoohoo.ncsa.uiuc.edu/cgi-bin/post-query"

como alternativa a ACTION= "mailto:xxx@xxx.xxx" para ver cómo remiten las informaciones sus formularios, o si utiliza Microsoft Internet Explorer.

Un tercer parámetro modificador se refiere al método en que se formateará el envío del contenido del formulario. Si no se especifica nada en contra, o si se indica:

ENCTYPE="application/x-www-form-urlencoded"

la recepción se realizará en forma codificada, suponiendo un formulario como el del listado de la Figura 1, de la siguiente manera:

nombre=Jaime&email=jaime-pena@bbs.idg.es&Enviar=Enviar

Para visualizarlo de forma más clara, puede probar a cambiar (o incluir) este otro método de codificación con el modificador:

ENCTYPE="text/plain"

Ahora la recepción se fraccionará en la forma:

nombre=Jaime

email=jaime-pena@bbs.idg.es

Enviar=Enviar

mucho más clara de comprender y procesar. Observe cómo se pasa en líneas separadas cada entrada del formulario y el contenido actual: controles TEXT de nombre y email y botón SUBMIT etiquetado Enviar.

Controles de entrada

Un formulario (FORM) tiene la misión de interactuar, recabando información, con el usuario. Además, responderá a las selecciones conforme a lo que le indiquemos; tal como comentamos anteriormente. Para proporcionar elementos de interactividad, el lenguaje HTML dispone de un conjunto de controles (hablando en términos de interfaz gráfica de usuario), que pueden contener información previa, permitir escribirla o seleccionar opciones de un conjunto. Ya habrá observado en los breves ejemplos anteriores, que esos controles se declaran entre y

, teniendo las propiedades de un tag común del lenguaje HTML (téngase presente el listado de la Figura 2).

La sintaxis más general de estos tags de controles de formulario es:

Imprimir Subir

Contenidos recomendados...

Comentar
Para comentar, es necesario iniciar sesión
Se muestran 0 comentarios
X

Uso de cookies

Esta web utiliza cookies técnicas, de personalización y análisis, propias y de terceros, para facilitarle la navegación de forma anónima y analizar estadísticas del uso de la web. Consideramos que si continúa navegando, acepta su uso. Obtener más información