PROMOCION XIV

Creación De Formulario

Creación de Formularios

@

Los formularios permiten recoger información de los usuarios (encuestas, pedidos,interfaces de búsqueda.. .)

@

Los formularios necesitan dos componentes:

  • el código fuente HTML que describe el formulario y
  • una aplicación en la parte del servidor -o en su defecto, una secuencia de comandos en la parte del cliente- para procesar la información que el usuario introduce en los campos del formulario creados por el código HTML.

@

Los formularios creados con Dreamweaver pueden incluir objetos estándar comocampos de texto , botones , campos de imagen , casillas de verificación ,botones de opción , listas/menús , campos de archivo y campos ocultos .

@

 Para insertar un formulario:

    • Colocar el punto de inserción en la posición en que desea que aparezca elformulario y eligir menú Insertar>Formulario. ó
    • Colocar el punto de inserción en la posición en que desea que aparezca el formulario y, en lapaleta Objetos, panel Formularios, hacer clic en el botónFormulario .

 Para crear un formulario:

  1. Arrastrar el botón Formulario  a la posición deseada de la página. 
    Si no se aprecia ningún resultado visible, comprobar que está activada la opción del Menú Ver > Elementos invisibles.
  2. Seleccionar el formulario y establecer sus propiedades en el Inspector de propiedades.

 

Se dispone de las opciones siguientes: 

· Nombre del formulario 
Asigna un nombre al formulario. La asignación de nombre al formulario permite controlarlo con un lenguaje de secuencia de comandos como JavaScript o VBScript. 
· Acción: 
Identifica la aplicación de la parte del servidor que procesa la información del formulario, especificada como un URL. Hacer clic en el icono de carpeta para localizar la aplicación, o escribir la ruta correspondiente. 
· Método: 
Define cómo se manejan los datos del formulario (Preder.; GEt y POST).

 

 

    1. En el Inspector de Propiedades, elegir uno de los siguientes métodos para definir lamanera en que se gestionan los datos del formulario: 
      · GET: 
      (Obtener): Añade valores del formulario al URL y envía al servidor una petición GET. Dado que los URL están limitados a 8.192 caracteres, no utilizar el método GET con formularios largos. 
      · POST: 
      (Publicar): Envía los valores del formulario en el cuerpo de un mensaje y envía al servidor una petición POST. 
      · Predert: 
      (Predeterminado) Usa el método predeterminado del explorador (generalmente, GET).

PROPIEDADES DE LOS OBJETOS DEL MENÚ FORMULARIO

icono

función aplicable

Formulario Coloca un formulario en el punto de inserción.

Los formularios son simplemente contenedores de elementos de formulario. Los límites del formulario no son visibles en la ventana de documento a menos que se active Ver > Elementos invisibles.

Campo de texto Coloca un campo de texto en el punto de inserción.

 

 ejemplo campo de texto

 

 

Establecer en el inspector de propiedades el nombre, el tamaño y el valor inicial.

Aceptan todo tipo de texto, tanto alfabético como numérico. El texto introducido puede mostrarse como una sola línea, múltiples líneas o como viñetas y asteriscos (para protección de la contraseña)

Botón Coloca un botón en el punto de inserción con las etiquetas NAME y VALUE predeterminadas como "Submit".

Llevan a cabo tareas cuando se hace clic en ellos, como enviar o restablecer formularios. Puede introducir una etiqueta personalizada para un botón, o bien usar una de las etiquetas predefinidas.

 

 ejemplo botón

 

 

Antes de insertar el botón, colocar el punto de inserción dentro de los límites del formulario. Los botones situados fuera del formulario no aparecen en el explorador. Utilizar el inspector de propiedades para establecer el nombre, la etiqueta y laacción.

 

Casilla de verificación Coloca una casilla de verificación en el punto de inserción.

Admiten múltiples respuestas en un solo grupo de opciones.

 

 ejemplo casilla verificación

 

 

 

Establezcer el nombre, el valor de activación y el estado inicial en el inspector de propiedades.

 

 

Botón de opción Coloca un botón de opción en el punto de inserción.

Representan opciones exclusivas de elección. Al seleccionar un botón en un grupo, se anula la selección de todos los demás botones del grupo.

 

 ejemplo botón opción

 

 

Establecer en el inspector de propiedades, el nombre, el valor de activación y el estado inicial.

Lista/menú Coloca una lista, o menú emergente, en el punto de inserción.

Presentan una lista de valores que el usuario puede elegir. El objeto puede presentar un menú emergente, que sólo aparece cuando el usuario hace clic en el nombre del objeto (y que admite una sola selección), o un cuadro de lista, que siempre muestra los valores en una lista de desplazamiento (y que acepta más de una selección).

                                                       

 ejemplo Lista/menú emergente

 

 

                                                                          

 ejemplo Cuadro de Lista de alto 2

 

 

Establecer en el inspector de propiedades, el nombre, el tipo y los valores iniciales .

Campo de archivo Coloca un campo de archivo en el punto de inserción.

Permiten al usuario examinar los archivos de sus discos duros y cargarlos como datos de formulario.

 

 ejemplo campo archivo

 

 

Establecer en el inspector de propiedades el nombre, el tamaño y el valor inicial.

Campo de imagen Coloca un campo de imagen en el punto de inserción.

Pueden usarse en lugar de los botones Enviar.

 

 ejemplo imagen

 

 

Establecer en el inspector de propiedades, el nombre, el tamaño, texto alternativo y el archivo de origen

Campo oculto Coloca un campo oculto en el punto de inserción.

Permiten almacenar información (como el destinatario de los datos de formulario o el objeto del formulario) que no son relevantes para el usuario, pero que serán usados por la aplicación que procesa el formulario.

 

Establecer en el inspector de propiedades el nombre y el valor.

 

 

Menú de salto Coloca un menú emergente de URL en el punto de inserción.

Permite insertar un menú en el que cada opción está vinculada a un documento, o un archivo.

Establecer los valores de la lista en el cuadro de diálogo que aparece.

 

UN EJEMPLO

 

FORMULARIO DE CONSULTAS

 

 

NOMBRE 

e-mail 

Tipo de Consulta:

informática  formación  internet 

Prioridad                                                              

 


CREACIÓN DE UN FORMULARIO

  1. Activar Menú Ver> Elementos Invisibles (si es que no lo está ya).
  2. Pulsar sobre el triángulo negro que hay en la parte superior la ventana de la PaletaObjetos para desplegar el menú oculto y elegir la opción Formularios. 
  3. Al aparecer los nuevos iconos, elegir el primer icono Insertar Formulario , el cual creará un marco (línea discontinua roja) en el cual se implantará el formulario; en el recuadroAcción de la ventana de Propiedades escribir-por ejemplo- mail to: jruiz@canalaudiovisual.com, esto le indica la acción a realizar al formulario una vez esté completado.(en este caso que cuando esté completo se envíe a esa dirección de correo electrónico)

CONTENIDO DE FORMULARIO

  1. A continuación centrar el cursor de escritura (Ctrl+Alt+C) y escribir: Formulario de Consultas en letra Courier New (Texto>Fuente>Courier New) y de tamañoEncabezado 1 y estilo cursiva, subrayado. Pulsar Intro.
  2. Ahora escribiremos la etiqueta del primer campo que insertaremos: teclear Nombrey a continuación, pulsar en el icono Insertar Campo de texto . (Observar que al lado de la etiqueta que hemos creado aparece un cuadro de texto, este es el campo receptor que permitirá al visitante de nuestras páginas escribir su nombre).

En la ventana de Propiedades buscar la opción Ancho Car (ancho caracteres) e introducir un valor de 60, (este valor indicará al formulario el tamaño que debe proporcionar al cuadro de texto creado previamente). Colocar el cursor al lado del cuadro de texto y pulsarIntro.

  1. Con el mismo porcedimiento, crearemos un campo de texto con la etiqueta e-mail. Y pulsaremos Intro.
  2. Ahora escribiremos Tipo de Consulta Y pulsar Intro.(este no lleva campo de texto)
  3. Escribir Informática y, a continuación, seleccionaremos el icono Insertar Botón de Opción  (este va a permitir crear campos de elección), pulsar la tecla Fin (para ir al final de la línea). A continuación, realizar el mismo proceso para los textos Formación, Ofimáticae Internet.
    Después de introducir el último elemento campo de elección, pulsar Intro.

 Para crear una lista con un menú desplegable.

Seguidamente pasaremos a crear una lista con un menú desplegable. Para ello, primero debemos crear una etiqueta identificativa de la lista: 
1. Escribir Prioridad, seleccionar el icono Inserte Menú de Lista
  y en su ventana depropiedades, activar las opciones Lista y Permitir Múltiples,


2. Después pulsar sobre la opción Valores de Lista, e introducir los elementos que compondrán nuestra lista/menú.

Por ejemplo: Alta, hacer clic en el botón +, escribir Media, hacer clic en elbotón +, escribir Baja hacer clic en el botón +. Al terminar hacer clic enAceptar.
(Observar que la lista ha sido creada y que, pulsando las flechas de la lista, se mueve hacia arriba o hacia abajo)

 Para crear un campo en el que se puedan exponer la consulta.

Ahora, crearemos un campo en el cual el visitante pueda exponer su consulta. Para ello:

  1. Seleccionar el icono Insertar Campo de Texto  y modificaremos las siguientes variantes:
  • Ancho Car.: 50
  • Tipo: Varias Líneas
  • Num Lineas: 8
  • Val Inicial: Escriba aquí su consulta

 

Pulsar Intro

 

 

 

 Para introducir los botones de enviar formulario ó cancelarlo

Ahora introduciremos dos botones muy importantes: son los de enviar el formulario ocancelarlo. Para ello se debe:

  1. Pulsar el icono Insertar Botón ,
  2. Seleccionar la palabra Submit escribir dentro de Etiqueta la palabra Enviar.
  3. Pulsar Intro.

* Volver a hacer el mismo proceso pero ahora escribiendo dentro de la etiqueta la palabraCancelar.

Seguidamente sólo nos queda realizar el enlace desde la Página de inicio. Guardar este documento con el nombre Formulario y abrir el creado anteriormente.

Seleccione el texto Página 1 junto con su botón de la izquierda, en la ventana de Propiedades y dentro del apartado Vincular, elija el fichero Formulario que hemos creado. Para visualizar el resultado pulse la tecla F12 y maximice la ventana para verlo mejor.

INDICE  

 

Este sitio web fue creado de forma gratuita con PaginaWebGratis.es. ¿Quieres también tu sitio web propio?
Registrarse gratis