Embed Size (px)
Citation preview
APLICACIÓN HTML
Grupo TRON
Objetivo de esta semana
Desarrollo de una aplicación usando Html,
CSS, Jsp y MySQL sobre arquitectura de 3
capas a partir del problema propio. Con
conexión a BD.
Estructura base de datos
La estructura que elegimos para realizar este
problema fue crear una tabla general que
tenga una lista de países asignados a una id,
y otra tabla con sus respectivas ciudades que
se relaciona con el país a través de una clave
foránea.
Estructura
Creación del Proyecto
Para llevar a cabo esta aplicación, creamos un
nuevo proyecto de tipo
Java Web>Web Aplication
Donde lo importante es seleccionar el server
GlassFish, y elegir como java EE version 5
Datos extras
Donde Glassfish es un servidor de
aplicaciones que implementa tecnologias JAVA
EE.
Y JAVA EE (Java Platform, Enterprise
Edition) que permita desarrollar y ejecutar
software orientado JDBC, RMI, e-
mail, JMS, Servicios Web, XML, entre otros.
En el proyecto…
En primer modificaremos el index.jsp que es la
pagina principal….
Primero creamos una tabla que la
insertaremos dentro del <body> y debajo del
<h1>
*La tabla debe tener 2 filas y 1 columna
Agregar “evento”
Agregando el “evento”
Para agregar el
evento insertamos
un Form .
A ese evento le insertaremos un Drop-Down List
que es como un jComboBox en HTML.
Con ctrl+espacio se nos
Desplegara una lista y
Elegimos Drop-down List.
Ahora agregamos un
Boton para que cuando se active, se lleve a
cabo el evento.
Establecer la conexión
Creamos un JDBC
Resource en la sección
Glassfish .
Y Creamos una nueva
conexión y le damos un
nombre acorde a la bd.
Y posteriormente
seleccionamos la
conexión.
Estableciendo conexión
Para dejar finalizada la
conexión se debe hacer una
referencia a la conexión.
En el archivo web.xml
Solo basta con agregar el
nombre que establecimos
anteriormente en el JNDI name.
Query
Ahora debemos agregar un DB Query a
nuestro index.html para que el evento quede
funcional, las sentencias MySQL deben estar
al principio del código.
En el Query debemos
Agregarle el data source
Y la sentencia.
Ahora que la Query esta hecho agregamos
estas líneas en el evento.
Respuesta.jsp
Ahora creamos nuestro archivo de respuesta y
en primer creamos el Query
Y agregamos esta línea, la cual será la que
nos extraiga las rows
Tabla
Estilo
Ahora le agregaremos un estilo a nuestra
pagina el cual los obtuvimos de la misma
pagina del tutorial…
Para ello creamos un nuevo archivo de tipo:
Y pegamos el contenido de la pagina…
Ahora solo basta con hacer una referencia del
estilo en nuestro código
Que debe estar dentro de el <head> de el
index.jsp y respuesta.jsp
