Ejercicio 1.5: Creación de una página de actualización

Antes de comenzar, debe completar el Ejercicio 1.4: Creación de registros nuevos.

Llegados a este punto, se han creado páginas para la visualización y creación de listados para el sitio Web. En este ejercicio se creará una página que permite a los usuarios actualizar y suprimir listados. La página de actualización será muy parecida a la página de creación, salvo que los campos de entrada visualizarán datos de un registro existente para que el usuario los pueda cambiar.

En primer lugar, se creará un registro relacional, que representa un registro existente de la base de datos. A continuación creará un formulario de actualización de JavaServer Faces para este registro relacional y, tras algunos pequeños cambios, la página estará lista para las pruebas.

Creación del registro relacional de actualización

Mostrar
  1. Abra el archivo update_record.jsp realizando una doble pulsación sobre él en la vista Explorador de proyectos.
  2. Suprima el texto predeterminado Place content here.
  3. En la vista Paleta, pulse en la bandeja Datos para expandirla.
  4. Arrastre el componente Registro relacional de la paleta al área vacía de contenido. Se abrirá la ventana Añadir registro relacional.
  5. En el campo Nombre, entre update_record.
  6. En Crear controles para, pulse Actualización de un registro existente.
  7. Asegúrese de que la opción Añadir controles de entrada/salida para visualizar el registro relacional en la páginas Web esté seleccionada.
  8. Pulse Siguiente.
  9. En el recuadro Tabla, pulse sobre la tabla W5SAMPLE.ADS.
  10. Pulse Siguiente. Se abrirá la página Selección de columnas y otras tareas.

Filtrado del resultado

Mostrar

Un registro relacional sólo puede mostrar un registro de la base de datos. Por lo tanto, hay que filtrar la tabla de base de datos de forma que sólo aparezca un registro para la edición del usuario. (No fue necesario filtrar la base de datos en el ejercicio anterior ya que se creó un registro nuevo y, por lo tanto, no había resultados de la base de datos para filtrar). Como cada registro de la base de datos tiene un número de ID exclusivo, se filtrará el resultado para un número de ID determinado.

  1. En Tareas, pulse Filtrar resultado. Se abre la ventana Filtros y en la columna Filtro se inserta la condición de filtro por omisión ID = #{param.ID}.

    La ventana Filtros tiene el aspecto siguiente:

    La ventana Filtros

    Este código filtra los registros de la base de datos de forma que sólo el registro con el número de ID especificado aparecerá en el registro relacional. Aprenderá más sobre esta condición en la sección Insertar un hiperenlace, más adelante en este ejercicio.

  2. Pulse Cerrar.
  3. Pulse Siguiente. Se abrirá la página Configurar controles de datos.
  4. En la sección Campos a visualizar, quite la marca del recuadro de selección que hay junto a todos los nombres de campo, salvo para aquellos que quiere que se visualicen en el formulario de entrada:
  5. Pulse sobre Arriba o Abajo para cambiar el orden de los nombres de campo de arriba hacia abajo, para que queden así:
    1. ID
    2. TITLE
    3. DESCRIPTION
    4. MAINCATEGORY
    5. PRICE
    6. PHONE
  6. Para el campo ID, seleccione Campo de salida de la lista desplegable en la columna Tipo de control.

    Aunque se quiera que los usuarios puedan ver el número de ID de registro, no se quiere que lo puedan actualizar. Al poner el campo ID en un campo de salida, se evitará el problema de los ID duplicados.

  7. Pulse Opciones. Se abrirá la ventana Opciones.
  8. Asegúrese de que la opción Botón Someter esté seleccionada.
  9. Entre Actualizar en el campo Etiqueta.
  10. Pulse Aceptar.
  11. La ventana Añadir registro relacional quedará de la siguiente manera:

    Ventana Añadir registro relacional

  12. Pulse Finalizar para generar el formulario de actualización en la página, según se muestra:

    Aspecto de la página actual

Programación del botón de actualización

Mostrar

Nuevamente, añadirá código para enviar al usuario a la página all_records.jsp para visualizar el registro modificado junto con el resto de registros.

  1. Pulse el botón Actualizar que acaba de crear en la página Web.
  2. Abra la vista Edición rápida.
  3. En la vista Edición rápida, pulse para colocar el cursor justo antes del código return "";
  4. Pulse Intro. Aparecerá una línea nueva antes de return "";
  5. Pulse el botón derecho del ratón sobre la línea en blanco y a continuación elija Insertar fragmento > Ir a página del menú contextual. Se abrirá la ventana Editar acción IrAPágina.
  6. De la lista desplegable, seleccione all_records.jsp como página de destino.
  7. Pulse Aceptar.
  8. El código de evento para el botón debería quedar de la siguiente manera:

    Ejemplo de código

    Ahora, una vez que el usuario ha actualizado el registro, la página que se mostrará en el navegador será all_records.jsp para ver el registro que se ha actualizado. El botón de supresión también debe devolver al usuario a la página all_records.jsp.

  9. Repita los pasos del 1 al 7 para editar el código de la misma forma para el botón Suprimir de la página Web.
  10. Guarde la página.

Insertar un hiperenlace

Mostrar

Ahora se crearán enlaces a la página all_records.jsp de forma que el usuario pueda seleccionar un registro de la base de datos a actualizar. #{param.ID} representa el número de ID del registro que actualizará la página de actualización. Cuando el usuario pulsa en el enlace del registro, el número de ID del registro se envía a la página update_record.jsp como el parámetro #{param.ID}. A continuación, el registro relacional filtrado que acaba de insertar en la página update_record.jsp se visualiza sólo dicho registro para su actualización.

  1. En la vista Explorador de proyectos, realice una doble pulsación sobre el archivo all_records.jsp para abrirlo en el editor.
  2. Pulse en cualquier lugar de la tabla de datos.
  3. Abra la ventana Propiedades.
  4. En la vista Propiedades, pulse h:dataTable de la lista de códigos HTML en la parte izquierda de la vista.
  5. En la parte derecha de la vista Propiedades, pulse Añadir para añadir una columna nueva.
  6. Entre Actualizar en el campo Etiqueta de la columna y pulse Intro. En la tabla de datos se genera una columna denominada Actualizar.
  7. Con la columna nueva seleccionada en la vista Propiedades, pulse Mover abajo hasta que la columna Actualizar se encuentre en la parte derecha de la tabla de datos.
  8. En la vista Paleta, pulse en la bandeja Componentes Faces para expandirla.
  9. Arrastre un componente Enlace de la paleta sobre la columna Actualizar que acaba de crear. Se abrirá la ventana Configurar URL.
  10. En el campo URL entre update_record.jsp como enlace de destino y entre Actualizar listado en el campo Etiqueta.
  11. Pulse Aceptar. En la columna Actualizar aparece el hiperenlace Actualizar listado.
  12. Pulse sobre el icono de enlace  Icono Enlace que hay junto al hiperenlace Actualizar listado en la columna Actualizar.
  13. En la vista Propiedades, pulse la pestaña Parámetro, que se encuentra justo bajo el código hx:outputLinkEx en la parte izquierda de la vista.
  14. Pulse Añadir parámetro y luego entre ID en el campo Nombre.

    Es necesario enlazar el parámetro ID a la columna ID del formulario de entrada. El enlace del parámetro hiperenlace a la columna ID de la lista de datos implica que cuando se pulse sobre el hiperenlace, el parámetro solicitado será el ID del registro de la lista.

  15. Seleccione el campo Valor y a continuación pulse sobre el botón Seleccionar objeto de datos de página en el campo. Se abrirá la ventana Seleccionar objeto de datos de página.
  16. En Objetos de datos, pulse sobre la columna ID de la Lista de registros all_recordlist(ADS), según se muestra a continuación:

    Ventana Seleccionar objeto de datos de página

  17. Pulse Aceptar.

    Ahora, cuando el usuario pulse sobre el enlace Actualizar listado, el sitio web permitirá al usuario actualizar información sobre el anuncio clasificado.

  18. Guarde el archivo y, si lo desea, pruebe la página. No olvide abrir antes all_records.jsp, ya que esta es la página que enlaza a update_record.jsp.

En este ejercicio, ha aprendido cómo crear páginas web que actualizan los registros de una base de datos. Ya puede comenzar el Ejercicio 1.6: Filtro de una Lista de registros relacionales

Comentarios
(C) Copyright IBM Corporation 2000, 2005. Reservados todos los derechos.