Glassfish: Pool de conexiones con PostgreSQL desde NetBeans

Hace poco estuve trabajando con un pequeño sistema web con Java y JSP el cual tenia clases que accedían a la base de datos a través de una conexión directa, entonces el sistema creció y me vi en la necesidad de poder utilizar una pool de conexiones para poder mejorar el acceso en rendimiento y tiempo de respuesta a la base de datos. Como siempre he mencionado en en este blog no pretendo darles a conocer la parte teórica dado que eso lo podemos encontrar en la
Wiki o en otras paginas con un mayor detalle, así que iremos directamente al trabajo práctico.

Entonces lo primero que debemos tener es configurado un gestor de base de datos con la respectiva base de datos creada la cual usaremos para realizar la conexión, en este caso PostgreSQL con la base de datos llamada bd_pool.

Una vez creada y configurada nuestra base de datos, lo que haremos ahora sera abrir nuestro NetBeans y poder registrar nuestro driver de conexión JDBC para PostgreSQL y luego crear la conexión que nos servirá de referencia para mas adelante. Entonces para esto dentro de NetBeans nos ubicamos en la pestaña de “services” (o servicios) y desplegamos la opción de “Databases” segun como se muestra en la imagen:

Luego le damos click derecho a “Drivers” y seleccionamos la opción “New Driver” entonces nos aparecerá una ventana en donde seleccionaremos la opcion “Add” y ubicamos el driver de conexión, en mi caso yo tengo el “postgresql-8.2-505.jdbc3.jar” quedando algo como esto:

Entonces solo le damos OK y ya tendremos el driver JDBC registrado y listo para usarse., segun como se muestra en la imagen:

Ahora lo que nos tocaría hacer es crear la conexión que nos servirá de referencia para poder crear el pool de conexiones, entonces en la lista mostrada anteriormente, le damos click derecho a PostgreSQL y seleccionamos la opcion “Connect Ussing” y nos aparecera una ventana en la cual llenaremos todos los datos requeridos, quedando algo como esto:

Le damos OK y luego nos aparecerá una ventana en donde seleccionaremos el esquema, entonces debido a que nosotros estamos utilizando el esquema por defecto entonces desplegamos el combo y seleccionamos “public” y luego veríamos la referencia de conexión dentro de la lista como se muestra en la imagen:

Bueno ya tenemos la primera parte de este proceso terminado, ahora continuaremos creando una aplicación web a la que llamaremos WebAppPool, solo para temas didácticos; creo que ya sabemos como hacerlo, así que no entrare en detalle allí.

Entonces una vez creado el proyecto web, le damos click derecho y nos ubicamos en “New” y luego seleccionamos la opción “Other..” y luego dentro de la opciones  nos ubicamos en Glassfish, quedando de esta manera:

Entonces una vez aquí haremos dos procesos, el primero sera seleccionar la opción “JDBC Connection Pool”, luego click en “Next” y en la siguiente ventana colocaremos como nombre “PoolDemo” y en la relación de conexiones existentes, seleccionamos la conexión activa que habíamos registrando anteriormente tal como se muestra en la figura:

luego le damos click en “Next” y obtendremos una ventana con el detalle de la conexión, tal como la URL, el usuario y el password, pero necesitaremos agregar mas detalle; para esto haremos click en el botón “Add” e iremos agregando el “servername”, “database” y “portnumber” tal como se muestra en la figura:

y luego para terminar esta parte le damos click en “Next” y nos mostrara una ventana con varias opciones de configuración, para lo cual solo cambiaremos la opción de “Steady Pool Size” que no es mas que el numero de conexiones que tendrá nuestro pool, en este caso lo cambiare de 8 a 5; pero hago la aclaracion que esto dependera de cada usuario, puede tener hasta mas conexiones, y luego finalizamos.

Esto nos generara un archivo con extensión *.xml y que estará ubicado dentro del directorio “Server Resources” con el nombre “sun-resources.xml” el cual debería contener lo siguiente:

“sun-resources.xml”

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE resources PUBLIC "-//Sun Microsystems, Inc.//DTD Application Server 9.0 Resource Definitions //EN" "http://www.sun.com/software/appserver/dtds/sun-resources_1_3.dtd">
<resources>
  <jdbc-connection-pool allow-non-component-callers="false" associate-with-thread="false" connection-creation-retry-attempts="0" connection-creation-retry-interval-in-seconds="10" connection-leak-reclaim="false" connection-leak-timeout-in-seconds="0" connection-validation-method="auto-commit" datasource-classname="org.postgresql.ds.PGSimpleDataSource" fail-all-connections="false" idle-timeout-in-seconds="300" is-connection-validation-required="false" is-isolation-level-guaranteed="true" lazy-connection-association="false" lazy-connection-enlistment="false" match-connections="false" max-connection-usage-count="0" max-pool-size="32" max-wait-time-in-millis="60000" name="PoolDemo" non-transactional-connections="false" pool-resize-quantity="2" res-type="javax.sql.DataSource" statement-timeout-in-seconds="-1" steady-pool-size="8" validate-atmost-once-period-in-seconds="0" wrap-jdbc-objects="false">
    <property name="URL" value="jdbc:postgresql://localhost:5432/bd_pool"/>
    <property name="User" value="postgres"/>
    <property name="Password" value="mipassword"/>
    <property name="serverName" value="localhost"/>
    <property name="databaseName" value="bd_pool"/>
    <property name="portNumber" value="5432"/>
  </jdbc-connection-pool>
</resources>

luego nos quedaría agregar el recurso o referencia que utilizara el pool para ser llamado desde una clase que necesite la conexión, para esto le damos click derecho al proyecto, seleccionamos “New” y dentro de la ventana de opciones seleccionamos Glassfish y luego seleccionamos la opción “JDBC Resourcce” le damos click en “Next” y nos aparecera una ventana en donde seleccionaremos el pool creado anteriormente y en la opcion “JNDI Name” colocaremos como nombre “jdbc/pooldemo” quedando de la siguiente manera:

y luego finalizamos. Ahora en el archivo “sun-resources.xml” tendremos lo siguiente:

“sun-resources.xml”

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE resources PUBLIC "-//Sun Microsystems, Inc.//DTD Application Server 9.0 Resource Definitions //EN" "http://www.sun.com/software/appserver/dtds/sun-resources_1_3.dtd">
<resources>
  <jdbc-resource enabled="true" jndi-name="jdbc/pooldemo" object-type="user" pool-name="PoolDemo">
    <description/>
  </jdbc-resource>
  <jdbc-connection-pool allow-non-component-callers="false" associate-with-thread="false" connection-creation-retry-attempts="0" connection-creation-retry-interval-in-seconds="10" connection-leak-reclaim="false" connection-leak-timeout-in-seconds="0" connection-validation-method="auto-commit" datasource-classname="org.postgresql.ds.PGSimpleDataSource" fail-all-connections="false" idle-timeout-in-seconds="300" is-connection-validation-required="false" is-isolation-level-guaranteed="true" lazy-connection-association="false" lazy-connection-enlistment="false" match-connections="false" max-connection-usage-count="0" max-pool-size="32" max-wait-time-in-millis="60000" name="PoolDemo" non-transactional-connections="false" pool-resize-quantity="2" res-type="javax.sql.DataSource" statement-timeout-in-seconds="-1" steady-pool-size="8" validate-atmost-once-period-in-seconds="0" wrap-jdbc-objects="false">
    <property name="URL" value="jdbc:postgresql://localhost:5432/bd_pool"/>
    <property name="User" value="postgres"/>
    <property name="Password" value="mipassword"/>
    <property name="serverName" value="localhost"/>
    <property name="databaseName" value="bd_pool"/>
    <property name="portNumber" value="5432"/>
  </jdbc-connection-pool>
</resources>

Y ya con esto tenemos la configuración lista para ser desplegada en el servidor para luego poder ser usado desde una clase u otro aplicativo que necesite una conexión.

Entonce ahora le damos clic derecho a nuestra aplicación web y seleccionamos “deploy”, con esto estaremos generando el pool de conexiones y nombre de recurso asignado a ese pool en nuestro servidor de aplicaciones. Esto lo podemos verificar entrando a la consola de administración de Glassfish; una vez dentro nos ubicamos en la opción Recursos, luego en JDBC y luego para ver nuestro pool creado nos ubicamos en Conjunto de Conexiones, y luego dentro de la lista debería estar “PoolDemo”, lo seleccionamos y nos ubicamos en la parte derecha del detalle y hacemos clic en “Sondeo”, si todo marcha bien deberías tener lo siguiente:

y luego para verificar si nuestro recurso se creo nos ubicamos en “Recursos JDBC” y en la lista debemos tener “jdbc/pooldemo”, tal como se muestra en la figura:

Y listo prácticamente eso seria todo con referencia a este tutorial, lo único que faltaría es llamarlo desde una clase cualquiera, cosa que “posteare” mas adelante. Trate de ser lo mas didáctico posible, espero les sirva.

Anuncios

Tutorial: Una forma rápida de usar Ibatis, Postgresql con Netbeans 6.7

Este es un pequeño tutorial en el cual trato de mostrar una forma rápida de como utilizar IBatis desde java para manejar persistencia de datos utilizando nuestro favorito postgresql como gestor de base de datos. Como siempre he dicho este blog no pretende mostrar la parte teórica, para eso ya existen varios sitios en donde podemos leerlo de forma debida, solo tratamos de mostrar el trabajo de manera rápida y practica. Bueno  manos a la obra; lo primero que debemos tener en cuenta que trabajaremos con la versión 2.3.4 de IBatis, hago esta aclaración debido a que actualmente existe una versión beta 5 de esta librería y aparentemente estas difieren por lo menos a la hora de la instancia y en la configuración de los xml, eso lo veremos en un post mas adelante. Una vez validado lo anterior, lo que debemos tener es la base de datos creada, para este caso por temas didácticos, utilizaremos la base de datos IBatisDemo la cual contiene una tabla llamada Productos con los campos mostrados en la imagen

Una vez creado la BD y la tabla, creamos el proyecto web al cual lo llamaremos WebAppIBatis y lo que haremos seria crear la siguiente estructura:

Como podran observar, ire indicando que significa cada archivo y mostrando el contenido para asi se pueda entender. Si se fijan en la parte de librerías ya tenemos anexadas las librerías de IBatis y el driver jdbc para postgresql respectivamente. Bueno según la estructura observamos un clase llamada ProductoBean, esta clase contiene los atributos necesarios para poder almacenar un registro de tipo Producto y asi ser mas manipulable, entonces la clase contendra la siguiente estructura:

package org.demo.bean;
/**
*
* @author nachxs
*/
public class ProductoBean {

    private int id_producto;
    private String desc_pro;
    private int stock;
    private String ind_vig;

    public int getId_producto() {
       return id_producto;
    }

    public void setId_producto(int id_producto) {
      this.id_producto = id_producto;
    }

    public String getDesc_pro() {
      return desc_pro;
    }

    public void setDesc_pro(String desc_pro) {
      this.desc_pro = desc_pro;
    }

    public int getStock() {
      return stock;
    }

    public void setStock(int stock) {
      this.stock = stock;
    }

    public String getInd_vig() {
      return ind_vig;
    }

    public void setInd_vig(String ind_vig) {
      this.ind_vig = ind_vig;
    }
}

Luego nos ubicamos en los archivos Conexion.xml que es el encargado de los parámetros de conexión a la base de datos  y tambbien el encargado de las referencias a todos los archivos xml que se puedan crear para mapear los consultas sql , como es el caso de Producto.xml el cual es el encargado de mapear las consultas sql que usaremos en este caso para la obtención de la información respectivamente:

Conexion.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE sqlMapConfig
   PUBLIC "-//ibatis.apache.org//DTD SQL Map Config 2.0//EN"
   "http://ibatis.apache.org/dtd/sql-map-config-2.dtd">
<sqlMapConfig>
 <transactionManager type="JDBC" >
   <dataSource type="SIMPLE">
    <property name="JDBC.Driver" value="org.postgresql.Driver"/>
    <property name="JDBC.ConnectionURL" value="jdbc:postgresql://localhost:5432/IBatisDemo"/>
    <property name="JDBC.Username" value="postgres"/>
    <property name="JDBC.Password" value="sistemasx"/>
   </dataSource>
 </transactionManager>
 <sqlMap resource="org/demo/xml/Producto.xml" />
</sqlMapConfig>

Productos.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE sqlMap
   PUBLIC "-//ibatis.apache.org//DTD SQL Map 2.0//EN"
   "http://ibatis.apache.org/dtd/sql-map-2.dtd" >
    <sqlMap namespace="Productos">
        <typeAlias alias="Productos" type="org.demo.bean.ProductoBean"/>

        <select id="getProducto" parameterClass="int" resultClass="Productos">
          SELECT id_producto, desc_pro FROM "Productos" WHERE id_producto = #value#
        </select>

        <select id="getProductos" resultClass="Productos">
          SELECT id_producto, desc_pro FROM "Productos"
        </select>
    </sqlMap>

Como podemos observar en este último archivo, estamos mapeando las consultas sql que utilizaremos, vemos que cada tag select tiene un id que es el identificador de cada consulta, tiene un parameterClass, el cual este nos ayuda a enviar parámetros de entrada ya sea datos primitivos como int, long, etc. así como también clases ya sea un bean por ejemplo y el resultClass el cual permitirá almacenar las respuestas a la consultas, en este caso estamos usando ProductoBean, el cual lo asociamos a un alias llamado Productos, según como se indica en el archivo Productos.xml.

Una vez terminado de revisar los archivos mostrados anteriormente, lo que hacemos ahora es crear un Servlet, el cual lo utilizaremos para poder invocar a nuestra consultas, según sea el caso; para esto haremos lo siguiente:

/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

package org.demo.action;
import com.ibatis.common.resources.Resources;
import com.ibatis.sqlmap.client.SqlMapClient;
import com.ibatis.sqlmap.client.SqlMapClientBuilder;
import java.io.IOException;
import java.io.PrintWriter;
import java.io.Reader;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.demo.bean.ProductoBean;

/**
 *
 * @author nachxs
 */

public class Consultar extends HttpServlet {

    /**
     * Processes requests for both HTTP <code>GET</code> and <code>POST</code> methods.
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */

    protected void processRequest(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        response.setContentType("text/html;charset=UTF-8");
        PrintWriter out = response.getWriter();
        try {
            String resource = "org/demo/xml/Conexion.xml";
            Reader reader = Resources.getResourceAsReader(resource);
            SqlMapClient sqlMap = SqlMapClientBuilder.buildSqlMapClient(reader);
            String idPro = request.getParameter("id_pro");
            ProductoBean producto = (ProductoBean) sqlMap.queryForObject("getProducto", Integer.parseInt(idPro));
            out.println("<table border='1'>");
            out.println("<tr>");
            out.println("<td>ID</td>");
            out.println("<td>Producto</td>");
            out.println("</tr>");
            out.println("<tr>");
            out.println("<td>" + producto.getId_producto() + "</td>");
            out.println("<td>" + producto.getDesc_pro() + "</td>");
            out.println("</tr>");
            out.println("<table>");
        } catch(Exception ex)  {
            out.println(ex.getMessage());
        } finally {
            out.close();
        }
    }

    /**
     * Handles the HTTP <code>GET</code> method.
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */

    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        processRequest(request, response);
    }

    /**
     * Handles the HTTP <code>POST</code> method.
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        processRequest(request, response);
    }

    /**
     * Returns a short description of the servlet.
     * @return a String containing servlet description
     */
    @Override
    public String getServletInfo() {
        return "Short description";
    }// </editor-fold>
}

Como podrán darse cuenta dentro de la variable resource tenemos la ruta en donde se encuentra ubicado el archivo xml con los parametros de conexion, en este caso Conexion.xml, y luego en esta linea sqlMap.queryForObject(“getProducto”, Integer.parseInt(idPro)) podemos observar como invocamos a la consulta que se encuentra dentro del archivo xml Productos.xml, identificado con getProducto enviando como parametro de entrada el código de producto y eso se recepciona en ProductoBean para luego ser leido mas facilmente.

Ahora solo nos queda ir al archivo index.jsp y solo invocar al servlet de esta manera tan simple:

<%--
    Document   : index
    Created on : 28/11/2009, 10:10:19 AM
    Author     : nachxs
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
    </head>
    <body>
        <form action="Consultar" method="POST">
            ID Producto: <input type="text" name="id_pro" />
            <input type="submit" value="Consultar" />
        </form>
    </body>
</html>

y prácticamente eso seria todo, como verán no es nada difícil, y mas o menos esto seria el resultado:

Tutorial: EJB, Persistencia y PostgreSQL en NetBeans 6.5

Hola a todos de nuevo por aquí retomando la creación de pequeños tutoriales en base a las prácticas desarrollando en mi diario aprendizaje. Esta vez veremos una forma rápida de como crear y usar un EJB utilizando persitencia de datos con TopLink y nuestro querido gestor de base de datos, PostgreSQL. No hablare sobre la parte teórica, porque como dije anteriormente eso lo podemos encontrar en cualquier página de internet que trate el tema. Bueno entonces manos a la obra…

Para empezar lo primero que debemos tener es una conexión activa a nuestra base de datos creado desde Netbeans; para este caso trabajare con una base de datos bd_tutorial que tengo de prueba, la cual tiene 2 tablas (Productos y DetalleProductos) y la que muestro a continuación.

tablasUna vez validado esto, ahora crearemos nuestro modulo EJB; para esto lo hacemos desde nuestro NetBeans, click en nuevo y luego seleccionamos Java EE y dentro de esta opción escogemos “EJB Module”, ponemos el nombre, del módulo en este caso EJBDemo, seleccionamos como servidor a GlassFish y finalizamos.

crearejb

Ya tenemos nuestro módulo EJB listo para crearle toda la lógica necesaria para obtener la información de las tablas de nuestra base de datos.

Ahora lo que haremos sera crear las clases entidad que representaran a nuestras tablas de la base de datos. Para esto hacemos click derecho en el módulo creado y nos dirigimos a la opción “Other” y luego en la ventana de opciones, seleccionamos “Persitence” y una vez alli seleccionamos “Entity Classes From DataBase”

entitdad

Le damos click en siguiente y nos aparecera una ventana en donde podemos ver la opción “Data Source”, desplegamos y seleccionamos “New Data source” y luego alli se nos mostrara una pequeña ventana en donde ingresaremos el nombre que reprentara a nuestro “Data Source”, que en este caso le pondremos jdbc/ejb y el “Database Connection” que es en donde escogeremos la conexión a la base de datos que habiamos agregado al inicio.

conexion

Una vez realizado este proceso, automaticamente se nos mostrara en el panel izquierdo todas las tablas creadas en esta base de datos. Ahora seleccionaremos la(s) tabla(s) con la que trabajaremos; para este caso seleccionaremos solo la tabla “Productos”, y ésta como se muestra en la imagen pasaria al panel derecho.

entidadproducto

Le damos click en siguiente y a continuación se nos muestra una ventana en donde tenemos el nombre de la tabla (lado izquierdo) y el nombre de la clase que representa a esta tabla (lado derecho), el nombre del proyecto, ingresaremos el nombre del paquete en donde se guardara la clase al cual llamaremos org.ejb.entidad.

entidadproducto_1

fijense que en la parte de abajo tenemos un boton que dice “Create Persistence Unit” le damos click alli y se nos mostrara una ventana con lo siguiente

unit

Alli podemos ver el nombre de la unidad de persistencia, el framework que proporcionara la persitencia y el Data Source que habiamos creado en un paso anterior; y luego click en crear.

Una vez hecho esto le damos click en siguiente a la ventana activa y alli vemos el tipo de mapeo de los datos, que para este caso lo dejamos por defecto y luego finalizar. Luego de esto tendremos la siguiene estructura

ejbcreadoVemos el “persistence.xml” que es en donde tenemos referencia a la base de datos mediante el DataSource, el nombre del proveedor para la persistencia (TopLink) y el nombre de unidad de persistencia, observamos las tablas de la base de datos y la clase “Productos.java”.

Ahora lo que haremos sera crear las clases que implementaran los métodos para toda la lógica, estas clases serán del tipo SessionBean, entonces lo que haremos es darle click derecho al proyecto, New y nos ubicamos en “persistence” y luego seleccionamos “Session Beans For Entity Classes”, que como nos podemos dar cuenta, creara las clases en base a la clase que representa la entidad, que en este caso es “Productos.java”, le damos click en siguiente y vemos la clase  Producto en el panel izquierdo, lo seleccionamos y damos click en Add para pasarlo al panel derecho. Luego click en siguiente y nos aparecera una ventana con los datos recogidos anteriormente, si gustan el nombre del paquete lo pueden cambiar para de esta forma tener estas clases separadas de las entidades, para este caso le puse  org.ejb.beans y luego seleccionamos Remote para el tipo de interface y finalizar.

sessionbean2

Ahora tendremos la siguiente estructura, ya con las clases del tipo SessionBean creadas y los métodos implelementados.

estructura1

Una vez hecho todo esto, solo nos quedaria deployarlo, para esto click derecho en el proyecto y seleccionamos deploy, si todo salio bien ya tendremos desplegado nuestro EJB en nuestro servidor Glassfish como podemos ver en la imagen.

glassfish

Bueno, con esto ya tenemos desplegado nuestro EJB pero ahora necesitamos utilizarlo en algún sitio. Para esto crearemos un proyecto web (imagino que ya saben como xD) al que llamaremos “AppWeb_EJB” y luego dentro del  proyecto crearemos un servlet al que llamaremos “appservlet_ejb” el cual es el que se encargaria de invocar a nuestro EJB.

Para esto dentro del método processRequest del servlet hacemos click derecho y seleccionamos la opción “Insert Code” y nos aparecera un menú emergente en el que escogemos la opción “Call Enterprise Bean..” y luego alli escogemos nuestro bean que en este caso es ProductosFacade como indica la figura

call1

Le damos click en OK y veremos que se agregó la referencia del EJB a nuestro proyecto en la parte de las librerias asi como en nuestro servlet como se puede observar en la figura

referenciaEntoces solo nos quedaria utilizar los metodos proporcionado por este EJB, para este caso utilizaremos el método “findAll” que es el que se encargaría de mostrarme toda la lista de productos, el cual mostramos en el siguiente código

servlet

Y luego desde nuestra página index,jsp solo crearemos la referencia a este servlet de la siguiente manera

index

Y listo, ejecutamos el proyecto web y estaremos mostrando los productos existentes.

Bueno, espero se haya entendido, trate de hacerlo lo mas “explicable” posible; como entenderan a veces es algo dificil poder plasmar en palabras este tipo de procesos, pero se hace lo que se puede.

Descarga el ejemplo: EJB

Tutorial:Combos dependientes con JSP, Ajax y Postgresql en Netbeans

Hola otra vez por aqui retomando el blog despues de un largo receso, como comprenderan con la familia y el trabajo se nos hace dificil a veces publicar algun post, pero bueno manos a la obra.

Este post es ha solicitud de unos compañeros que estan aprendiendo a trabajar con jsp, ajax y postgresql y necesitaban alguna guía práctica para trabajar la parte del llenado de combos de forma dependiente justamente utilizando ajax y obteniendo la data desde una base de datos.

Bueno, lo primero que debemos tener en cuenta es la estructura de tablas en la base de datos desde donde obtendremos la informacion. Para este ejemplo tome como ejemplo la siguiente estructura.

tablascomo podemos observar la base de datos se llama bd_tutorial y las tablas serian productos y detalle_producto respectivamente.

Una vez creado las tablas, ahora lo que hacemos es crear nuestro proyecto web al cual llamaremos webapp_ajaxDemo y comenzar armar nuestra estructura de archivos jsp, javascript y clases java, las cuales accederan a la informacion de la base de datos. Creamos el proyecto y generamos la siguiente estructura propuesta:

proyectoAhora, lo que haremos sera ver como obtener la informacion de la base de datos, para esto vamos a trabajar nuestras clases java empezando por los beans en donde almacenaremos la informacion  y terminando por las clases  DAO , las cuales seran las que recogeran la informacion de la base de datos.  Lo primero es tener la estructura de los archivos productoBean.java y detalleProductoBean.java, mas o menos seria la siguiente:

producto1

detalleproducto

Una vez detallada la clases Bean, ahora nos enfocamos en las clase BO y DAO, yo siempre hago esta distribucion para tener en cuenta el manejo de capas, esto ayuda mucho. Ahora veremos la estructura de la clase productoBo.java, aqui es donde definiremos los metodos que tendran acceso a los métodos de las clase DAO.

productobo

Los métodos que usaremos getProducto y getDetalleProducto los cuales nos devuelven como resultado un ArrayList de Beans esto con la finalidad de poder tener toda la informacion y poder seleccionar lo necesario. Ademas hacen referencia a métodos de las clases DAO la cuales ya tenemos definidas.

Ahora, veremos las estructuras y codificacion de las clases  que obtienen la información de la BD productoDao.java y detalleProductoDao.java respectivamente:

Para las clases productoDao.java y detalleProductoDao.java, por cuestiones de espacio solo estoy mostrando los métodos que acceden a la información, se asume que ustedes ya tienen definido los métodos de conexion y desconexion respectivamente.

productoDao.java:

productodao

detalleProductoDao.java:

detalleproductodao

Una vez ya completada la estructura y codificacion de las clases java, ahora pasaremos a codificar las paginas JSP, lo primero que haremos sera mostrar el primer combo que serian los productos, para esto mostraremos una parte de la codigo del archivo index.jsp la cual sufrira alguna moficiacion mas adelante, por el momento tenemos lo siguiente:

 

combo_1

Fijemos en los recuadros de color rojo, en el primer recuadro lo que hago es importar la clase productoBo y productoBean, dado que en el primero se tiene el metodo que obtendria la informacion de los productos, y en el segundo recuadro es donde muestro los productos los cuales son almacenados en beans del tipo productoBean por eso la declaracion en el primer recuadro.

Deben tener en cuenta que en la linea de código en donde muestro el detalle del producto en la opcion value el combo se esta poniendo el id del producto, esto para que cuando mandemos el producto se tome el id para poder realizar la busqueda en el detalle y no el nombre del producto.

Ahora veremos la parte de AJAX, para esto tenemos un archivo javascript ajax_producto.js en el cual tendremos el siguiente código:

ajax_producto1

Vemos que estamos declarando la funcion getDetalleProducto al cual le estamos enviando como parametro id_pro, luego en la parte mas abajo vemos que hacemos la referencia a la pagina ajax_detalleProducto.jsp, que en la que recuperaremos la informacion de la tabla de detalles enviando como parametro el id_pro y ademas un identificador para hacer refresco a nuestras busquedas, esto por un problema en algunos navegadores con el manejo de su cache. Y la funcion resultado_detalle que es donde le indicamos donde mostrarnos el resultado.

Fijarse bien en esto ultimo ya que como veran estamos utilizando el identificador del elemento en donde pondremos el resultado que para este caso es result_detalle.

una vez terminado esto lo que haremos sera codificar la pagina que obtendra la informacion del detalle de producto, que en este caso es ajax_detalleProducto.jsp

detalle_ajax

Ahora solo nos queda adecuar la pagina index.jsp para que pueda hacerse la invocación, mostraremos el codigo segmentado por cuestiones de espacio.

index_1

En este primer segmento, podemos ver que aqui se hace la llamada a la libreria javascript ajax_producto.js la cual contiene a la función getDetalleProducto, fijense en el evento onchange del combo, alli es donde llamamos a la funcion que retornaria la informacion del detalle.

Ahora para el segundo segmento vemos el id=”result_detalle” que es el identificador que se utiliza para mostrar el combo con el detalle.

index_2Y practicamente esto seria todo. Se debe tener en cuenta que esto se hizo de forma rápida solo para cuestiones de enseñanza, esto se puede mejorar notablemente tal vez utilizando algun framework como jQuery o mejorando el código propuesto. Espero les sea de utilidad para algunos que recien empiezan con esto

PD: Los errores ortográficos son aproposito.

Descarga el ejemplo: webapp_ajaxDemo (Ejemplo modificado para trabajar con 3 combos)

Autocomplete = “off” con Struts

Uno de los pequeños inconvenientes que se me presento al desarrollar aplicaciones web y utilizar etiquetas struts, era la compatibilidad con algunos atributos. Regularmente cuando trabajo con cuadros de texto siempre agrego el atributo “autocomplete = off” esto para que no se almacene el texto que haya escrito con anterioridad (en algunos casos es necesario). Pero al utilizar etiquetas struts este atributo no esta o por lo menos no encontre alguno analogo a este; entonces decidi probar un codigo en javascript y agregarlo dentro de mi formulario quedando de la siguiente forma.

Para empezar este es el código javascript 

autocomplete_01

Una vez que tenemos ya el código lo que hacemos ahora es agregarlo en el “body” dentro del atributo “onload” de la siguiente manera:

autocomplete_02

y ahora solo nos queda agregarlo en el formulario que tiene etiquetas struts para que todos lo cuadros de texto cumplan este atributo, quedando de la siguiente forma:

autocomplete_03

De esta manera pude utilizar este atributo, espero les sea de utilidad.

PD: Fijense que en struts para representar el atributo “Id” se hace con “styleId”, esto para que no haya confusiones.