- taller - uso de ajax

Facultad de ingeniera Programa ingeniera de sistemas UNIVERSIDAD DEL MAGDALENA

011420 2015I: PROGRAMACION PARA WEB

TALLER. CREAR APLICACIONES USANDO AJAX

Desarrollar una aplicacin Web que permita gestionar y operar un CRUD en una Clnica de

mascotas, mediante una arquitectura multicapas, donde se pueda percibir una clara separacin de

las capas de Presentacin, Lgica de Negocio y Acceso a datos. Se utilizar para el desarrollo Ajax,

Servlets, POJO, patrn de diseo DAO bajo el modelo arquitectnico MVC.

REQUERIMIENTOS FUNCIONALES El sistema permitir agregar nuevos propietarios con sus respectivas mascotas.

El sistema permitir listar y editar los propietarios de las macotas. Adicionalmente el

usuario podr editar los datos de las mascotas asociadas a un propietario.

REQUERIMIENTOS NO FUNCIONALES Utilizar el motor de bases de datos relacionales MySQL.

Utilizar y respetar el diseo grfico propuesto, la estructura de la base de datos y el diseo

entregado.

Implementar el patrn arquitectnico MVC

Utilizar Ajax con jQuery, bootstrap para el diseo de la interfaz grfica, Servlets para los

controladores, el patrn DAO para la capa de acceso a datos.

El proyecto deber ser entregado en un archivo .zip con los integrantes del grupo de

trabajo.

DISEO DE LA APLICACIN Flujo de interaccin (Interfaz de usuario) Al ingresar a la aplicacin el usuario tendr dos opciones (Listar propietario o Agregar mascotas) las cuales se explican a continuacin. Agregar mascotas

Esta interfaz permitir al usuario agregar nuevos propietarios con sus respectivas mascotas.

Interfaz inicial de agregar mascotas muestra una tabla con el listado de todos los propietarios de mascotas y la opcin de agregarle mascotas, adems tiene un formulario para agregar nuevos propietarios.



Para agregar nuevos propietarios el usuario deber diligenciar todos los campos que son obligatorios y presionar click en el botn agregar, como muestra la siguiente figura.



Al presionar click sobre el botn agregar los datos del nuevo propietario de mascotas se agregar en la tabla donde se listan los propietarios junto con la opcin de agregar mascota a dicho propietario, ver figura a continuacin.

Otra de las opciones que tiene el usuario es agregar una mascota a un propietario ya creado, para ello debe seleccionar la opcin Agregar mascota que tiene el usuario en la tabla, al presionar click sobre esta opcin se desplegar un nuevo formulario con los campos necesarios para crear una mascota, adems deber aparecer justo antes de los campos el nombre del propietario para el que se va a crear una nueva mascota, ver figura.



Al agregar los datos necesarios para crear la mascota el usuario deber presionar click sobre el botn agregar, ver figura a continuacin.



Al presionar click sobre el botn agregar del formulario agregar mascotas, los datos ingresados se listarn en un tabla en la parte inferior del formulario y los campos del formularios quedarn en blanco, como se muestra en la siguiente figura. El usuario podr agregar tantas mascotas como desee.



Listar propietarios

Esta interfaz permitir al usuario listar todos los propietarios de mascotas, ver y editar los detalles

de un propietario, ver y editar todas las mascotas asociadas a un propietario seleccionado. Est

compuesta por una tabla con el listado de propietarios de mascotas junto con la opcin de editar

dicho propietario. Adems contiene un formulario que permite donde se muestra la informacin

detallada del propietario y el cual permite editar cada uno de sus atributos y por ltimo muestra el

listado de las mascotas asociadas a ese propietario con la posibilidad de editar la informacin de

cada una de las mascotas. En la siguiente figura se muestra la pgina inicial de listar propietarios.



Al presionar click sobre la opcin Ver Detalles de un usuario particular la informacin del

propietario seleccionado se mostrar en el formulario de Ver/Editar detalles del propietario y en la

seccin de Ver/Editar Mascotas se visualizar las mascotas asociadas al propietario que se

seleccion. Ver figura a continuacin.



El listado de mascotas asociadas a un propietario tiene la opcin de modificar la informacin de la

mascota que selecciono para edicin, al presionar click sobre la opcin editar el formulario de

edicin se mostrar justo sobre las celdas en la misma tabla, como se muestra en la siguiente

figura. Tenga en cuenta que el tipo de mascota no se puede modificar.

Las interfaces anteriores son las que han sido aceptada para la aplicacin, por lo tanto debe ser

respetadas en su totalidad, por lo cual los desarrollares debern hacer una implementacin similar

en html5 usando bootstrap.

Diseo de paquetes de la aplicacin

La distribucin de paquetes ha sido disea para que se pueda observar de manera clara la

separacin de las responsabilidad de cada una de las clases que compone el sistema. La siguiente

figura muestra la distribucin de cada uno de los paquetes.



Modelo inicial de excepciones propias de la aplicacin

Toda aplicacin real debe contener su propio modelo de excepciones diseado por el equipo de

desarrollo que cubra los posibles errores que pueden ocurrir en tiempo de ejecucin. La creacin

de excepciones propias da una mejor semntica a la codificacin, permitiendo una mejor

comprensin por aquellos que quieran leer el cdigo.

El modelo inicial que se ha diseado para la aplicacin es el siguiente y debe ser ampliado segn

las necesidades de la aplicacin.



Estas excepciones son diseadas para el tratamientos de errores de instancia [FBELLAS] por lo que

de describir solo las subclases.

InstanceNotFoundException: se intenta recuperar un objeto persistente a partir de una

clave (identificador) que no existe.

DuplicateInstanceException: se intenta insertar un objeto persistente con una clave (o

campo equivalente) que ya existe.

Estas son solo algunas excepciones diseadas, proponemos a los desarrolladores alimentar este

diseo con ms excepciones que sean necesarias en la aplicacin. Las excepciones que se

muestran en la figura anterior sern suministradas.

Modelado de entidades

Para esta aplicacin, se definen dos entidades Propietario y Mascotas:

Para Propietario hay que guardar: identificador del propietario, nombres, apellidos,

direccin, telfono

Para Mascota hay que guardar: identificador,una referencia al propietario al que

pertenece la mascota, nombre, tipo, fechaNacimiento

El diagrama de entidades para la aplicacin se muestra en la siguiente figura.



El script de la base de datos, ser suministrado junto con este documento.

Diseo capa de acceso a datos

Un DAO define una interfaz para las operaciones de persistencia (mtodos CRUD y de bsqueda)

relacionadas con una clase persistente particular. Utilizando Generics (caractersticas introducida

en Java SE 5.0), se puede disear un DAO genrico con las operaciones comunes para todas las

clases persistentes, crear, actualizar, eliminar, buscar. Cada entidad persistente tendr su propio

DAO, que extender el genrico para aadir operaciones propias, normalmente aadir

operaciones de bsqueda utilizando diferentes criterios. La interfaz parametrizada del DAO

genrico recibe 2 argumentos:

E, es la clase persistente para la que se implementar el DAO

PK, define el tipo del identificador de la clase persistente. El identificador debe ser

Serializable.

Los mtodos estn definidos en base a esos parmetros y no estn acoplados a ninguna tecnologa

de persistencia [FBELLAS]

La siguiente figura es el diagrama de la interfaz genrica.

La implementacin en cdigo java es la siguiente:



public interface IGenericDAO { E crear(E entidad) throws DuplicateInstanceException; E actualizar(E entidad); void eliminar(E entidad) throws InstanceNotFoundException; ; E findById(PK id) throws InstanceNotFoundException; }

La implementacin de un DAO genrico para JDBC ser:

La codificacin en cdigo java es la siguiente, tenga en cuenta que usted deber implementar los

mtodos de la interfaz.



public class GenericDAOJdbc implements IGenericDAO {

protected Connection connection; protected PreparedStatement preparedStatement; protected ResultSet resultSet; public GenericDAOJdbc(Connection connection) { this.connection = connection; } public void setConnection(Connection connection) { this.connection = connection; } public E crear(E entidad) throws DuplicateInstanceException { //DEBE IMPLEMENTAR LA LGICA PARA ESTE MTODO } public E actualizar(E entidad) { //DEBE IMPLEMENTAR LA LGICA PARA ESTE MTODO } public void eliminar(E entidad) throws InstanceNotFoundException { //DEBE IMPLEMENTAR LA LGICA PARA ESTE MTODO } public E findById(PK id) throws InstanceNotFoundException { //DEBE IMPLEMENTAR LA LGICA PARA ESTE MTODO } }

Los DAOs especficos para una clase persistente son los siguientes. Tenga en cuenta que esta es

una propuesta que segn las necesidades puede variar.

La figura muestra el diagrama de clases para el DAO que gestiona la persistencia de Propietario.

En la interfaz PropietarioDAO se definen todos aquellos mtodos que se necesiten para

Propietario y en la clase PropietarioDAOJdbc se deben implementar los mtodos de la interfaz

PropietarioDAO y heredar los mtodos de la clase GenericDAOJdbc. En el diagrama slo se define

el mtodo buscarTodos( ) pero si usted lo considera necesario puede agregar ms mtodos a la

interfaz.



La siguiente figura muestra el diagrama de los DAO para la gestin de persistencia de Mascota. Se

define una interfaz MascotaDAO con los mtodos necesarios para manejar la informacin de

persistencia de Mascota diferente al CRUD. De igual manera se disea una clase MascotaDAOJdbc

que implementa los mtodos de la interfaz MascotaDAO y hereda los mtodos del CRUD de la

clase GenericDAOJdbc. Cabe aclarar que este diseo no es rgido y si consideran necesario que hay

que agregar nuevos mtodos a la interfaz MascotaDAO pueden hacerlo.



REFERENIAS

[FBELLAS] Bellas Permuy, F., Curso Integracin de sistemas (java). 2010 2011. Consultado el 23

de Abril de 2015. http://www.tic.udc.es/is-java/is-java-2009-2010/index.html

- taller - uso de ajax

Documents