|
|
Cursos de Creacion de Páginas Web en CD. Recíbalos contra reembolso en su domicilio Garantía: si no le gustan, le devolvemos el dinero. Tel.: 96 169 19 76 |
|
|
|
|
Creación de un Formulario en Frontpage conectado a una base de datos Access
Antes de crear la base de datos debemos reflexionar un momento sobre la información que utilizaremos en nuestra aplicación.
Al almacenar una reserva hotelera es fundamental tener en cuenta los datos personales del titular de la reserva (Nombre, Apellido, Teléfono de contacto, E-mail de contacto) así como los datos que afecten al establecimiento (Fecha de llegada, Fecha de partida, Tipo de habitación, Cantidad de habitaciones).
Como primer paso hemos de crear la base de datos en Access para almacenar los datos de las reservas de un hotel.
Debemos presionar el botón de Inicio, luego buscar en Programas el icono de Microsoft Access.
Comenzaremos con una nueva base de datos Access (en blanco); para hacer esto seleccionaremos la primera opción (remarcada con un rectángulo) tal como se refleja en la siguiente imagen:
Luego seleccionaremos el lugar donde se almacenarán toda la información de la nueva base de datos. Para una correcta organización es recomendable que se almacene en el website creado por Microsoft Front Page.
Hay que tener presente que Microsoft Access nombra por defecto a la base de datos con la extensión .mdb, sólo hay que modificar el nombre.
En este caso la nombraremos hotel, por lo que se denominará “hotel.mdb”.
A continuación es necesario crear las tablas a utilizar para el sistema de reservas.
En la izquierda de la pantalla existe un área, encabezada por “Objetos” donde debemos seleccionar “Tabla”. El objeto Tabla está seleccionado cuando aparece en levemente presionado como si fuera un botón.
Luego, en el área de la derecha, debemos hacer doble click sobre la leyenda “Crear una tabla en vista de diseño”.
Ambos puntos están remarcados con un rectángulo en la siguiente imagen:
Al hacer un click en “Crear una tabla en vista Diseño” se desplegará la ventana en donde ingresaremos las columnas correspondientes.
En la ventana se muestran tres columnas y una “ficha” donde se describen todas las propiedades generales de cada campo de la tabla.
Estas columnas son:
Nombre del Campo: aquí debemos escribir el nombre del campo.
Tipo de Datos: aquí se despliega un menú, del cual debemos seleccionar el tipo de dato según la información a almacenar.
Descripción: aquí podemos escribir una pequeña descripción para no olvidar algún dato importante.
A continuación se muestra una porción de imagen:
Al comenzar esta lección reflexionamos acerca de los campos necesarios para almacenar los datos de una reserva, pues bien, es el momento de volcar todo esto en la nueva tabla.
En cada dato es necesario modificar los valores generales de cada propiedad de cada campo ubicados en la parte inferior de la pantalla.
Es un campo de texto, ya que aquí se guardará el apellido de la persona que realice la reserva. A este campo no le cambiaremos ningún valor en las propiedades del campo.
Es un campo de texto, ya que aquí se guardará el nombre de la persona que realice la reserva. A este campo no le cambiaremos ningún valor en las propiedades del campo.
Es un campo de texto, ya que aquí se guardará el e-mail de la persona que realice la reserva. A este campo no le cambiaremos ningún valor en las propiedades del campo.
Es un campo numérico ya que aquí se guardará el número telefónico de la persona que realice la reserva. Aquí asignaremos una longitud cero y sin decimales en las propiedades del campo, ya que un número de teléfono no tiene estas características.
Es un campo con formato de Fecha/Hora. En las propiedades generales del campo seleccionaremos del menú desplegable de formato “Fecha corta”.
Es un campo con formato de Fecha/Hora. En las propiedades generales del campo seleccionaremos del menú desplegable de formato “Fecha corta”.
Es un campo de tipo texto, debido a que se almacenarán los diferentes tipos de habitación del hotel (simple, doble, triple, etc.) con una longitud máxima de 50 caracteres.
Es un campo de tipo numérico, debido a que se almacenará una cantidad entera de habitaciones.
Los campos se pueden visualizar en la siguiente imagen:
Luego de crear todos los campos necesarios almacenaremos la tabla, basta con presionar del menú principal Guardar y escribir el nombre de la tabla. En este caso la llamaremos “Reservas” y presionaremos sobre el botón Aceptar.
NOTA: Cerrar la base de datos Access cuando se lo utiliza desde Front Page.
Desde el Menú de inicio, buscaremos el icono de Programas y luego el de Microsoft Page.
En la barra de herramientas, presionaremos sobre la hoja en blanco para crear un nuevo documento, el cual será el formulario de reservas.
Luego lo guardaremos dentro del website en el front page como formulario_de_reserva.asp
Insertar un formulario
Es necesario crear un formulario para capturar todos los datos de la reserva. Para esto accederemos desde el menú superior, a la opción Insertar, luego seleccionaremos Formulario y por último, nuevamente Formulario.
En la siguiente imagen se remarca con un rectángulo rojo la opción que debemos seleccionar.
En consecuencia de dicha acción, se insertará en la hoja en blanco un formulario, el cual se delimita con líneas punteadas. El mismo cuenta con dos botones: Enviar y Restablecer.
Para lograr un aspecto de prolijidad en la presentación del formulario, utilizaremos una tabla de dos celdas horizontales por cuatro celdas verticales. Para esto deberemos seleccionar Insertar - Tabla del menú superior.
Es importante que recordemos la existencia de diversos tipos de campos de formularios, debiendo utilizarlos dependiendo del tipo de valores a ingresar. Por ejemplo:
Para el Apellido utilizaremos un campo de texto, el cual permite ingresar una línea de texto.
Para el Tipo de habitaciones utilizaremos un botón de radio (radio button) para seleccionar un tipo de habitación.
En una celda de la tabla escriba Apellido, en la celda siguiente seleccione del menú superior la opción Insertar – Formulario – Cuadro de texto de una línea.
Con esto el formulario tendrá un campo de entrada de texto.
Este tipo de campo de formulario lo utilizaremos para permitir seleccionar el tipo de habitación. En la celda siguiente seleccione del menú superior la opción Insertar – Formulario – Botón de opción.
Para permitir el ingreso de la cantidad de habitaciones a reservar nos valdremos de otro tipo de campo de formulario: el menú desplegable.
En la celda correspondiente seleccionaremos en el menú superior la opción Insertar – Formulario – Menú desplegable.
Un menú brinda la posibilidad de seleccionar una de entre varias opciones; para ello es necesario definirlas. Este será nuestro paso siguiente, la definición de las propiedades de los diferentes campos del formulario.
Los diferentes tipos de campo del formulario los podremos adaptar a diversas necesidades, para ello modificaremos las propiedades del campo.
Este componente permite ingresar libremente una cadena de caracteres. Presione el botón secundario del ratón sobre el componente y seleccione Propiedades de campo de formulario, tal como lo indica la siguiente imagen.
Desde las propiedades del campo es importante que le asignemos un nombre al mismo para luego poder identificarlo. Se le puede asignar un valor inicial, con lo cual al cargar esta página web el usuario visualizará este valor en el campo Apellido.
Presionaremos sobre el botón Validar, para lograr una validación sencilla.
Es importante comprender que una reserva con ciertos campos en blanco no es útil, por lo cual es conveniente realizar una verificación de los campos del formulario de reservas.
La siguiente es la pantalla que permite definir la validación del campo de texto:
En ella definimos que el único tipo de dato a ingresar será de texto con letras así como la longitud mínima requerida será de dos caracteres.
En nuestro formulario existen otros campos del mismo tipo como: Nombre, Email, Fecha de Llegada y Fecha de Salida. Lo que debemos hacer es repetir tanto la inserción como la definición de propiedades para cada campo.
El menú desplegable nos brinda la posibilidad de seleccionar un ítem de una lista de elementos previamente definida.
Presione el botón secundario del ratón sobre el componente y seleccione Propiedades de campo de formulario.
Desde las propiedades del campo es importante asignarle un nombre para luego poder identificarlo durante su proceso, en este caso se denomina “Cantidad”.
Al ser un menú desplegable, se deben ingresar todos los valores que se deseen visualizar en el mismo. Esto se logra presionando el botón Agregar que se encuentra a la derecha de la pantalla. Por cada valor que quiera agregarse a la lista deberá pulsarse agregar.
En caso de ser necesaria la modificación de algún valor se puede hacer fácilmente a través del botón Modificar. Es interesante destacar que las opciones se pueden ordenar como se desee presionando sobre los botones Subir o Bajar, moviendo los elementos dentro de la lista.
Una vez que ingresamos los campos del formulario, el mismo en su estado terminado se visualiza de la siguiente forma:
Es necesario construir un vínculo entre el website y la base de datos, lugar donde se almacenará toda la información que el formulario de reservas obtenga.
Para lograr esta relación es necesario seleccionar en el menú superior la opción Insertar, luego Base de datos y seleccionar Resultados.
La siguiente captura de pantalla muestra el ejemplo.
Luego emergerá la siguiente pantalla del asistente del Microsoft Front Page:
Aquí deberá seleccionar Usar una nueva conexión de base de datos y presionar sobre el botón Crear, con lo cual accederá a la configuración del Web.
Desde aquí podrá Agregar una nueva conexión con tan solo presionar Agregar. En este punto completará con:
Nombre: nombre de la conexión, a la cual llamaremos base.
Tipo de conexión: al cual se le asignara la opción Archivo o carpeta del web actual.
Al presionar Examinar seleccionará la base de datos hotel.mdb creada anteriormente con Microsoft Access.
Luego de realizar todos estos pasos, presionaremos el botón Aceptar.
Si realizó todos los pasos correctamente deberá aparecer la siguiente pantalla:
Nuevamente presione Aceptar para llegar hasta la pantalla de configuración del Web, donde encontrará la conexión que recientemente creo con un signo de interrogación que identifica su estado.
Ahora sólo resta seleccionar con el ratón esta conexión y presionar sobre el botón Comprobar para que el Web se conecte a la base de datos hotel.mdb.
Como resultado final satisfactorio deberá aparecer un tilde verde en el estado de la conexión “Base”, la siguiente imagen refleja el resultado esperado.
Para lograr una actualización total del trabajo en Front Page, presione sobre el botón Aplicar y luego el botón Aceptar.
Luego de realizar la conexión a la base de datos y de crear el formulario hay que relacionar ambos elementos para lograr el efecto deseado: enviar los datos del formulario hacia la base de datos.
Primero seleccionaremos el formulario, mediante el botón secundario del ratón accederemos a la opción Propiedades del Formulario.
En la parte inferior de la pantalla, dentro de Propiedades de formulario, existe un campo para asignarle un nombre al formulario, allí escribiremos “Formulario”.
En caso de trabajar con marcos recuerde escribir el marco de destino.
Allí elegiremos como ubicación para almacenar resultados (que en este caso serán las reservas) la referencia a “Enviar a la base de datos” y luego nuevamente presionaremos sobre el botón Opciones.
En Opciones aparecerán tres tabletas: Resultados de la base de datos, Campos guardados, Campos adicionales.
En esta tableta se define la conexión entre la base de datos y el formulario, así como la tabla de la base de datos que intervendrá en este proceso.
Aquí deberá seleccionar la conexión creada anteriormente (Base) y luego la tabla destinataria de las reservas creada para tal fin, denominada “Reservas”.
En esta sección también se pueden definir páginas de errores y página de confirmación relacionadas al formulario.
Estas páginas son útiles para generar cierto dinamismo y atención al cliente de manera personalizada.
Ante un proceso correctamente realizado, se le da las gracias por utilizar este medio para realizar una reserva, haciendo esto a través de la página de confirmación.
Ante una falla en la validación, donde se verifica que la veracidad de la información que se envía es correcta, se utiliza la página de error con el fin de indicarle al usuario el problema que existe en los datos que ingresó.
Se recomienda confeccionar estas páginas una vez que el formulario funcione correctamente.
La imagen muestra el resultado final de la tableta
En este punto es donde definiremos la relación entre la base de datos y el formulario, aquí indicaremos en que columna de la base de datos almacenaremos la información del formulario.
Es recomendable seleccionar campo por campo y revisar si todo es correcto, para ello seleccionaremos el campo del formulario y presionaremos el botón con la leyenda Modificar.
Una vez que llevamos a cabo esa acción, se lleva a cabo una conexión con la base de datos y se indica el nombre del campo del formulario y un menú desplegable con TODAS las columnas de la tabla en cuestión.
Es aquí donde podemos seleccionar las parejas campo de formulario / campo de la tabla dentro de la base de datos.
Desde aquí podemos decidir adicionar cierta información extra a la base de datos.
Existe la posibilidad de seleccionar todos, algunos o bien ninguno.
Luego presione Aceptar dos veces.
Este es el formulario terminado!
Curso de Frontpage 1997, 2000, 2002, XP. Curso de creación y diseño de páginas web con Frontpage
Curso de creación y diseño de páginas web con Dreamweaver
