Recorrer Listas con JSTL

Intentando publicar información útil y practica en esta ocación explicare de manera fácil y rápida la forma para recorrer un objeto List con JSTL para crear una tabla o llenar un select.

Para empezar se necesita tener habilitado dentro del proyecto JSTL, para esto se necesita tener el jar jstl.jar. Verificar que se tenga el encabezado:


<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>


Despues con el siguiente código se recorre el List


<c:forEach items="${listAvisos}" var="item">

   ${item.property1} : ${item.property2} : ${item.property3} <br/>

</c:forEach>


donde:

• listAvisos en un objeto dentro del request o session del tipo java.util.List
  
• item es un objeto del tipo MO con sus respectivos setters y getters.
  

Con esto tendremos código limpio y ya no necesitamos tener imports en el JSP.

Ejemplo de Tabla:

Para este ejemplo suponemos que tenemos un objeto MO con los atributos de: Nombre, Apellido, Teléfono con sus respectivos setters y getters, el codigo quedaria como:


<table>
<tr>
<th> NOMBRE </th>
<th> APELLIDO </th>
<th> TELEFONO </th>
</tr>
<c:forEach items="${listContactos}" var="item">
<tr>
<td> ${item.nombre} </td>
<td> ${item.apellido} </td>
<td> ${item.telefono} </td>
</tr>
</c:forEach>
</table>


Ejemplo de Select

Usamos la misma suposición del ejemplo anterior, y el código es:


<select id="slcContacto" name="slcContacto">
<c:forEach items="${listContactos}" var="item">
<option value="${item.telefono}"> ${item.nombre} </option>
</c:forEach>
</select>


Creación de un componente de Avisos II

Hola de nuevo, en este post continuare la creación de un componente de avisos, ahora enfocandame en la parte de Java y BD, es decir, el lado del servidor.

1. Crearemos un servlet ( también puede ser un Action, etc..) donde llamaremos a los DAO y otra lógica (tan compleja o básica como se necesite), para no extenderme en código solo pondré la parte de la función post.


/**
* Controlador de Componentes
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
 System.out.println("->> BatchAjustesAction <<-");
 String url="/blank.jsp";
 try {
  String componente = request.getParameter("component");
  System.out.println("- componente:" + componente);
  if ( componente != null) {
   if ( componente.trim().equals("mostrarAvisos")) {
   // Carga Mensajes del sistema
   url="/jsp/componentes/avisos.jsp";
   AvisoDAO avisosDAO = new AvisoDAO();
   List listAvisos = avisosDAO.getAvisos();
   request.setAttribute("listAvisos", listAvisos);
  }
 } catch( Exception e) {
  e.printStackTrace();
  url="/jsp/common/error.jsp";
 }
 this.dispatch(request, response, url);
}

protected void dispatch(HttpServletRequest request,HttpServletResponse response, String url) {
 try {
  System.out.println("-- dispatch: " + url);
  RequestDispatcher rd= request.getRequestDispatcher(url);
  rd.forward(request, response);
 } catch(Exception e){}
}


6. Las clases axiliares de AvisoDAO y AvisoVO son como siguen:


public class AvisoDAO {
  List listAvisos = null;
  Connection conn = null;
  PreparedStatement pstm = null;
  ResultSet rset = null;
  try {
   AvisoVO item = null;
   String sql = "SELECT * FROM TBL_AVISO A, TBL_AVISO_DET B
WHERE B.IDAVISO = A.IDAVISO
AND A.ESTATUS = 'A' ORDER BY A.FECHA DESC, SECUENCIA ASC
   conn = DBManager.getConnection();
   pstm = conn.prepareStatement(sql);
   pstm.clearParameters();
   rset = pstm.executeQuery();
   listAvisos = new ArrayList();
   String key = "";
   boolean primero = true;
   while( rset.next()) {
    String idAviso = rset.getString("IDAVISO").trim();
    if( !key.equals(idAviso)) {
     if( !primero) {
      listAvisos.add(item);
     }
     item = new AvisoVO();
     item.setIdAviso( idAviso);
     item.setFecha( rset.getDate("FECHA"));
     item.setDetalle( rset.getString("DETALLE"));
     primero = false;
     key = idAviso;
    } else {
     item.appendDetalle( rset.getString("DETALLE"));
    }
   }
   if( item != null) {
    listAvisos.add(item);
   }
   System.out.println("----- Total de avisos: " + listAvisos.size());
 } catch( Exception e) {
   e.printStackTrace();
 } finally {
  try{ if( rset !=null) rset.close(); }catch( Exception e) {}
  try{ if( pstm !=null) pstm.close(); }catch( Exception e) {}
  try{ if( conn !=null) conn.close(); }catch( Exception e) {}
 }
}



public class AvisoVO {

  private Date fecha;
  private String idAviso;
  private String detalle;

  public void appendDetalle(String detalle) {
   if( this.detalle == null) {
    this.detalle = detalle;
   } else {
    this.detalle += detalle;
   }
  }
  getters() ..
  setters() ..
}


7. Las tablas tienen la siguiente estructura:


CREATE TABLE TBL_AVISO (
IDAVISO CHAR(10),
FECHA DATE,
ESTATUS CHAR(1),
PRIMARY KEY(IDAVISO)
);

CREATE TABLE TBL_AVISO_DET (
IDAVISO CHAR(10),
SECUENCIA NUMBER,
DETALLE CHAR(250),
PRIMARY KEY(IDAVISO, SECUENCIA)
);


Donde TBL_AVISO tiene el encabezado del aviso, y TBL_AVISO_DET contiene el mensaje del aviso, se tiene esta estructura ya que el mensaje se encuentra en el campo de DETALLE y si este supera los 250 caracteres se tiene que crear otro registro en la tabla de AVISO_DET con un numero de secuencia mayor, un ejemplo de aviso seria:


INSERT INTO SIPAB_AVISO VALUES ('TEST',SYSDATE,'A');

INSERT INTO SIPAB_AVISO_DET VALUES('TEST',0,'Mensaje de Prueba');
INSERT INTO SIPAB_AVISO_DET VALUES('TEST',1,' continucacion del mensaje de prueba');


Integrando esta parte con el primer Post estará listo y funcional un componente para Mostrar Avisos Básico y puede ser posicionado en cualquier parte de la página.

Todos los comentarios, sugerencias y dudas son bien recibidos.

Creación de un componente de Avisos I

Como en muchos sistemas el mostrar avisos a los usuarios es algo que se va volviendo cada vez mas necesario ( cambios, dudas generales o que el sistema no va a funcionar tal día) mostrare una manera sencilla de crear un componente que muestre avisos, para esto usare jQuery para manejar la parte de Ajax e interfaz y Java para la conexión con la BD y lógica.

Primero necesitamos las librería de jQuery y también la libreria Classy Query , esta última para crear clases en Java Script usando jQuery, y las ponemos en nuestra carpeta respectiva donde tengamos nuestros archivos js, como recomendacion estan deben estar en una subcarpeta llamada lib, ya que los librerias de apoyo.

Una vez que tenemos las librerías seguimos los siguientes pasos:

1. Llamamos las librerías en la página:


<SCRIPT language="JavaScript" src="<%= request.getContextPath() %>/js/lib/jquery.js">
<SCRIPT language="JavaScript" src="<%= request.getContextPath() %>/js/lib/jquery-classy">


2. En el jsp donde queramos el componente creamos un div y le asignamos un ID, en esta caso CAviso, y le ponemos la clase con el estilo que queramos :


<div id="CompAviso" class="avisos"> </div>


3. Creamos un archivo llamado jComponentes.js, este servirá de comunicación entre la interfaz y el servidor, y le ponemos lo siguiente:


 var jComponentes = jQuery.Class.create({
  init: function(contextPath) {
   this.contextPath = contextPath;
   this.action = '/servlet/ComponentesAction';
   this.waitMsg = '<img src="/myApp/images/load.gif" /> Espere un momento..';
  },

  mostrarAvisos: function(nombreContenedor) {
   $('#'+nombreContenedor).html(this.waitMsg);
   $('#'+nombreContenedor).load(
    this.contextPath + this.action,
     {
      component: 'mostrarAvisos'
     }
   )
  }
});


4. Ponemos nuestra clase en el encabezado:


<SCRIPT language="JavaScript" src="<%= request.getContextPath() %>/js/jPortada.js">


5. Ahora falta crear la vista del componente, para esto creamos un jsp llamado avisos.jsp y lo ponemos en la carpeta de componentes, para este ejemplo use la libreria JSTL por lo que es necesario incorporla:


<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>


y dentro del body:


<div class="tituloBox"> Avisos myApp</div>
  <c:forEach items="${listAvisos}" var="item">
   <b> ${item.fecha} : </b>${item.detalle}<br/>
  </c:forEach>


6. Ya para terminar solo lo mandamos a llamar, para esto con el siguiente código es suficiente:


<script type="text/javascript">
 var componentes = new jComponentes('<%= request.getContextPath() %>');
 componentes.mostrarAvisos('CompAviso');
</script>


En el siguiente post mostrare la parte que corresponde a Java y BD.

Bienvenidos

Hola a todos, les doy la Bienvenida a este Blog donde tratare de llevar con frecuencia ideas y ejemplos para todos aquellos que están inmersos en el mundo de Java enfocados a la WEB y quieren adentrarse al mundo de Ajax y a la WEB 2.0.