FORMULARIO

Introducción a los formularios

Los formularios permiten interactuar con los visitantes del sitio o recopilar información de ellos. Por ejemplo, puede solicitar el nombre y la dirección de correo electrónico de un usuario o hacer que los visitantes respondan a una encuesta o proporcionen comentarios acerca del sitio.

Los formularios constan de dos partes: el código HTML que describe el formulario (por ejemplo, los campos, etiquetas y botones que ve el usuario en la página) y una secuencia de comandos o aplicación que procesa la información enviada. No se puede recopilar datos de formulario sin utilizar una secuencia de comandos de procesamiento.

Puede utilizar Dreamweaver para crear distintos objetos de formulario, como campos de texto, campos de contraseña, botones de opción, casillas de verificación, menús emergentes o imágenes en las que es posible hacer clic (por ejemplo, un botón Enviar).

También puede utilizar el comportamiento validar formulario para comprobar la información que proporciona un visitante; por ejemplo, puede comprobar si una dirección de correo electrónico contiene el símbolo "@" o si se han introducido datos en un campo "obligatorio".

Objetos del formulario

Los tipos de entrada de los formularios se denominan objetos de formulario. Puede insertar objetos de formulario por medio de la categoría Formularios del panel Objetos o seleccionando Insertar > Formulario e Insertar > Objetos de formulario.

La categoría Formularios del panel de objetos proporciona los siguientes botones:

Insertar formulario: Inserta un formulario en el documento. Dreamweaver inserta etiquetas form de apertura y cierre de formulario en el código HTML. Los elementos adicionales del formulario, como los campos de texto o los botones, deben insertarse entre las etiquetas form para que los datos se procesen correctamente con todos los navegadores.

Insertar campo de texto: Inserta un campo de texto en un formulario. Los campos de texto aceptan todo tipo de texto, tanto alfabético como numérico. El texto introducido puede mostrarse como una sola línea, varias líneas o como viñetas y asteriscos (para protección de la contraseña).

Insertar botón: Inserta un botón de texto en un formulario. Los botones llevan a cabo tareas cuando se hace clic en ellos, como enviar o restablecer formularios.

Insertar casilla de verificación: Inserta una casilla de verificación en un formulario. Las casillas de verificación admiten múltiples respuestas en un solo grupo de opciones y permiten que los usuarios seleccionen tantas opciones como sean necesarias.

Insertar botón de opción: Inserta un botón de opción en un formulario. Los botones de opción representan opciones exclusivas de selección. Cuando se selecciona un botón en un grupo, se anula la selección de los demás botones del grupo; por ejemplo, los usuarios pueden seleccionar Sí o No.

Insertar listas/menús: Permite crear opciones para el usuario en una lista. La opción Lista muestra los valores de las opciones en una lista de desplazamiento y permite que los usuarios seleccionen múltiples opciones. La opción Menú muestra los valores de las opciones en una lista desplegable y permite que los usuarios seleccionen una sola opción.

Insertar campo de archivo: Inserta un cuadro de texto vacío y un botón Examinar en un documento. Los campos de archivo permiten al usuario examinar los archivos de sus discos duros y cargarlos como datos de formulario.

Insertar campo de imagen: Permite insertar una imagen en un formulario. Los campos de imagen pueden usarse en lugar de los botones Enviar para crear botones Gráficos.

Insertar campo oculto: Inserta un campo en el documento que permite almacenar datos del usuario. Los campos ocultos permiten almacenar información introducida por el usuario, como un nombre, una dirección de correo electrónico o una preferencia de compra, y utilizarlos la próxima vez que el usuario visite el sitio.

Insertar menú de salto: Inserta una lista de navegación o un menú emergente. Los menús de salto permiten insertar un menú en el que cada opción está vinculada a un documento o un archivo. Consulte "Crear menús de salto".

Partes del formulario 

Un formulario contiene propiedades que son invisibles para el usuario. Las propiedades especifican cómo se procesa el formulario

Un formulario consta de tres partes básicas:

• • Etiquetas form, que incluyen el URL de la secuencia de comandos CGI que procesará el formulario y el método que se utilizará para enviar los datos a un servidor.

  • Campos de formulario, como campos de texto, menús, casillas de verificación o botones de opción.

  • El botón Enviar, que envía los datos a la secuencia de comandos CGI del servidor.

Para añadir un formulario a un documento

• 1. Elija el punto donde quiere insertar el formulario y lleve a cabo una de estas operaciones:

     1. • En la categoría Formularios del panel Objetos, seleccione el ícono Insertar formulario.

        • Elija en el Menú Insertar > Formulario.

  2. En el documento, haga clic en el contorno para seleccionar el formulario si es que no está ya seleccionado.

  3. Las opciones del formulario se pueden configurar en el inspector de propiedades:

• 1. En el campo Nombre del formulario, escriba un nombre exclusivo para el formulario. La asignación de nombre al formulario permite hacer referencia a él.

  2. En el campo Acción, especifique la ruta del URL en el que reside la secuencia de comandos o la aplicación que procesará el formulario. Para ello, lleve a cabo una de estas operaciones:

1. En el menú emergente Método, elija el método con el que se gestionarán los datos del formulario. Elija POST para enviar los valores del formulario en el cuerpo de un mensaje. Elija GET para adjuntar los valores del formulario al URL y enviar la información al servidor.

   1. Nota: No utilice el método GET con formularios largos. Los URL están limitados a 8.192 caracteres. Si los datos enviados superan dicha longitud, la información se trunca dando lugar a resultados imprevistos. Tampoco utilice GET para gestionar números de tarjeta de crédito u otra información confidencial, ya que este método de transferencia de información no es seguro.

Objetos de formulario

Una vez insertado el formulario, puede comenzar a añadirle objetos. A continuación se verán los tipos de objetos:

Campos de Texto

Un campo de texto es un objeto de formulario en el que los usuarios pueden escribir datos.

Hay tres tipos de campos de texto:

Los campos de texto de una línea: Se utilizan para proporcionar respuestas compuestas por una sola palabra o una frase corta; por ejemplo, un nombre o una dirección.

Los campos de texto de varias líneas: Ofrecen mayor espacio al visitante para escribir la respuesta. Puede determinar fácilmente el número de caracteres o el número de líneas que puede introducir el visitante.

Los campos de contraseña: Son campos de texto especiales. Cuando el usuario escribe en ellos, el texto queda oculto y aparecen asteriscos o viñetas

Para crear un campo de texto de una línea o de contraseña

• 1. Coloque el punto de inserción en el interior del formulario y lleve a cabo una de estas operaciones:

     1. • Elija Insertar > Objeto de formulario> Campo de texto.

        • En la categoría Formularios del panel Objetos, haga clic en el Ícono Insertar campo de texto.

• 1. En el campo Campo de texto, escriba un nombre único para el campo, ya que no se puede repetir el nombre de un campo de texto en un formulario. No utilice espacios; para separar palabras, utilice el carácter de subrayado. Por ejemplo, escriba primer_apellido en lugar de primer apellido.

  2. En el campo Ancho car, lleve a cabo una de estas operaciones:

     1. • Acepte el valor predeterminado, que establece la longitud del campo de texto aproximadamente a 24 caracteres.

        • Escriba un número para especificar la longitud del campo de texto.

  3. En el campo Car máx, lleve a cabo una de estas operaciones:

     1. • Deje el campo vacío para que los usuarios puedan escribir todo el texto que deseen. Si el texto introducido por el usuario supera el ancho de caracteres (longitud) del campo, el texto se desplaza.

        • Escriba el número máximo de caracteres que el usuario podrá introducir en el campo. Por ejemplo, puede que desee limitar un campo de edad a tres dígitos o un campo de contraseña a ocho caracteres. Si el usuario supera el número máximo de caracteres, el formulario produce un sonido de alerta.

 Campos ocultos

Los visitantes del sitio no pueden ver los campos ocultos, que son elementos invisibles situados en un documento para recopilar o enviar información. La información de un campo oculto se transfiere al servidor cuando se envía un formulario y utiliza el par de nombre y valor definido al configurar el campo oculto.

Dreamweaver añade un marcador al documento cuando se inserta un campo oculto. Si inserta un campo oculto y el marcador no es visible, elija Ver > Ayudas visuales > Elementos invisibles para verlo.

Para crear un campo oculto:

• 1. Coloque el punto de inserción en el interior del contorno y lleve a cabo una de estas operaciones:

     1. • Elija Insertar > Objeto de formulario> Campo oculto.

        • En la categoría Formularios del panel Objetos, haga clic en el ícono Insertar campo oculto.

          • Aparecerá un marcador en el documento.

1. Las opciones del campo oculto se pueden configurar en el Inspector de propiedades:

• 1. En el campo Campo oculto, escriba un nombre exclusivo para el campo.

  2. En el campo Valor, escriba el valor que desee asignar al campo.

Casilla de verificación y botón de opción

Utilice los objetos de formulario casilla de verificación y botón de opción para crear objetos de selección predefinidos. El usuario hace clic en una casilla de verificación o un botón de opción para hacer una elección.

Para insertar una casilla de verificación

• 1. Coloque el punto de inserción en el interior del formulario y lleve a cabo una de estas operaciones:

     1. • Elija Insertar > Objeto de formulario> Casilla de verificación.

        • En la categoría Formularios del panel Objetos, haga clic en el icono Insertar casilla de verificación.

• 1. En el campo Nombre de Casilla, escriba un nombre descriptivo para la casilla de verificación.

1. En el campo Valor activado, escriba un valor para la casilla de verificación.

2. Por ejemplo, en una encuesta, podría establecer el valor cuatro (4) para la opción "Estoy totalmente de acuerdo" y uno (1) para la respuesta "No estoy de acuerdo".

   1. En Estado inicial, haga clic en "Activado" para que la opción aparezca marcada cuando el formulario se cargue inicialmente en el navegador.

Para insertar botones de opción

• 1. Coloque el punto de inserción en el interior del contorno y lleve a cabo una de estas operaciones:

     1. • Elija Insertar > Objeto de formulario> Botón de opción.

        • En la categoría Formularios del panel Objetos, haga clic en el ícono Insertar botón de opción.

• 1. En el campo Botón opción, escriba un nombre descriptivo para el grupo de opciones.

  2. En el campo Valor activado, escriba el valor que desea enviar a la aplicación del lado del servidor o a la secuencia de comandos de procesamiento cuando el usuario seleccione el botón de opción.

  3. En Estado inicial, haga clic en Activado para que la opción aparezca marcada cuando el formulario se cargue inicialmente en el navegador.

Listas y menús

Utilice una lista de opciones o un menú para presentar distintas opciones al usuario en un espacio limitado. Las listas y los menús de formulario se crean en el mismo Inspector de propiedades, pero proporcionan distinta funcionalidad al usuario.

Utilice una lista cuando desee controlar el número de opciones que se muestran. Establezca el alto en líneas de la lista; cuando el número de opciones de la lista supere su alto en líneas, aparecerá una barra de desplazamiento con la que el usuario podrá ver todas las opciones. También puede permitir que el usuario seleccione varios elementos de una lista.

Utilice un menú cuando el espacio sea muy reducido. Un menú muestra una sola línea e incluye una flecha abajo en la que el usuario hace clic para ver las opciones restantes del menú. El usuario sólo puede seleccionar un elemento de menú de una sola vez.

Para crear una lista de desplazamiento

• 1. Coloque el punto de inserción en el interior del formulario y lleve a cabo una de estas operaciones:

     1. • En la categoría Formularios del panel Objetos, haga clic en el ícono Insertar lista/menú.

        • Elija Insertar > Objeto de formulario > Lista/menú.

  2. En el campo Campo Lista/menú del inspector de propiedades, escriba un nombre exclusivo para la lista.

• 1. En el campo Tipo, seleccione Lista.

  2. En el campo Alto, escriba el número de líneas que se mostrarán en la lista. El número predeterminado de líneas es 4. Si el número especificado es inferior al número de opciones de la lista, aparecerán barras de desplazamiento.

  3. Si desea permitir que los usuarios seleccionen más de una opción de la lista, elija Permitir múltiples de la opción Selecciones.

  4. Haga clic en Valores de lista para añadir las distintas opciones. Aparecerá el cuadro de diálogo Valores de lista.

• 1. Coloque el punto de inserción en el campo Etiqueta de elemento y escriba el texto que aparecerá en la lista.

  2. En el campo Valor, escriba el texto o los datos que desea enviar al servidor cuando el usuario seleccione el elemento.

  3. Para añadir otro elemento a la lista de opciones, haga clic en el botón con el signo más (+) y repita los pasos 7 y 8.

  4. Cuando haya terminado de ingresar los valores de la lista, presione Aceptar.

Para crear un menú

Para crear un menú, siga exactamente los pasos de la lista y en la opción  tipo en el Inspector de propiedades elija Menú.

Botón

Los botones de formulario controlan las operaciones de los formularios. Puede utilizar un botón de formulario para enviar los datos introducidos por los usuarios al servidor o para restablecer un formulario, de forma que los usuarios puedan corregir la información antes de enviarla.

Para crear un botón de texto

• 1. Coloque el punto de inserción en el interior del formulario y lleve a cabo una de estas operaciones:

     1. • Elija Insertar > Objeto de formulario> Botón.

        • En la categoría Formularios del panel Objetos, haga clic en el ícono Insertar botón.

  2. En el campo Nombre del botón del inspector de propiedades, escriba un nombre para el botón.

  3. En el campo Etiqueta del inspector de propiedades, escriba el texto que desee mostrar en el botón.

  4. En el campo Acción, lleve a cabo una de estas operaciones:

     1. • Seleccione Enviar para enviar el formulario para su procesamiento cuando el usuario haga clic en el botón.

        • Seleccione Restablecer para restablecer el formulario cuando el usuario haga clic en el botón.

        • Seleccione Ninguna para activar otra acción basada en la secuencia de comandos de procesamiento cuando el usuario haga clic en el botón; por ejemplo, para calcular un total.