Skip to content

8. La biblioteca de etiquetas JSTL

8.0.1. Introducción

Consideremos la vista [erreurs.jsp] que muestra una lista de errores:

Image

Hay varias formas de escribir una página de este tipo. Aquí nos interesamos únicamente en la parte relacionada con la visualización de los errores. Una primera solución es utilizar código Java, tal como se ha hecho:


<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@ page import="java.util.ArrayList" %>

<%
// se recuperan los datos del modelo
  ArrayList erreurs=(ArrayList)request.getAttribute("erreurs"); 
  String lienRetourFormulaire=(String)request.getAttribute("lienRetourFormulaire");
%>

<html>
    <head>
      <title>Personne</title>
  </head>
  <body>
      <h2>Les erreurs suivantes se sont produites</h2>
    <ul>
        <%
          for(int i=0;i<erreurs.size();i++){
            out.println("<li>" + (String) erreurs.get(i) + "</li>\n");
        }//for
      %>
    </ul>
    <br>
    <form name="frmPersonne" method="post">
      <input type="hidden" name="action" value="retourFormulaire">
    </form>
    <a href="javascript:document.frmPersonne.submit();">
      <%= lienRetourFormulaire %>
    </a>
  </body>
</html>

La página JSP recupera la lista de errores de la consulta (línea 8) y la muestra mediante un bucle de Java (líneas 19-23). La página combina código HTML y código Java, lo cual puede ser problemático si la página debe ser mantenida por un diseñador gráfico, quien por lo general no entenderá el código Java. Para evitar esta mezcla, se utilizan bibliotecas de etiquetas que aportarán nuevas posibilidades a las páginas JSP. Con la biblioteca de etiquetas JSTL (Java Standard Tag Library), la vista anterior queda así:


<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@ taglib uri="/WEB-INF/c.tld" prefix="c" %>

<html>
    <head>
      <title>Personne</title>
  </head>
  <body>
      <h2>Les erreurs suivantes se sont produites</h2>
    <ul>
            <c:forEach var="erreur" items="${erreurs}">
                <li>${erreur}</li>
            </c:forEach>
    </ul>
    <br>
    <form name="frmPersonne" method="post">
      <input type="hidden" name="action" value="retourFormulaire">
    </form>
    <a href="javascript:document.frmPersonne.submit();">
      ${lienRetourFormulaire}
    </a>
  </body>
</html>

La etiqueta (línea 4)

<%@ taglib uri="/WEB-INF/c.tld" prefix="c" %>

indica el uso de una biblioteca de etiquetas cuya definición se encuentra en el archivo [/WEB-INF/c.tld]. Estas etiquetas se utilizarán en el código de la página, precedidas por la letra c (prefix="c"). Se puede utilizar cualquier prefijo de su elección. Aquí, c significa [core]. Los prefijos permiten utilizar bibliotecas de etiquetas que podrían tener los mismos nombres para ciertas etiquetas. El uso del prefijo elimina la ambigüedad. La nueva página ya no tiene código Java en los dos lugares donde lo tenía anteriormente:

  • la recuperación de la plantilla de la página [erreurs, lienRetourFormulaire] (parte eliminada)
  • la visualización de la lista de errores (líneas 13-15)

El bucle de visualización de errores se ha sustituido por el siguiente código:


            <c:forEach var="erreur" items="${erreurs}">
                <li>${erreur}</li>
            </c:forEach>
  • La etiqueta <forEach> sirve para delimitar un bucle
  • La notación ${variable} se utiliza para escribir el valor de una variable

La etiqueta <forEach> tiene aquí dos atributos:

  • items="${errores}" indica la colección de objetos sobre la que se debe iterar. En este caso, la colección es el objeto «errores». ¿Dónde se encuentra este? La página JSP busca un atributo llamado «errores» sucesivamente y en el siguiente orden:
    • el objeto [request], que representa la solicitud enviada por el controlador: request.getAttribute("errores")
    • el objeto [session], que representa la sesión del cliente: session.getAttribute("errores")
    • el objeto [application], que representa el contexto de la aplicación web: application.getAttribute("errores")

La colección designada por el atributo items puede adoptar diversas formas: tableau, ArrayList, un objeto que implemente la interfaz List, ...

  • var="error" sirve para asignar un nombre al elemento actual de la colección que se está procesando. El bucle <forEach> se ejecutará sucesivamente para cada elemento de la colección items. Dentro del bucle, el elemento de la colección que se está procesando se designará aquí como error.

La notación ${error} inserta el valor de la variable «error» en el texto. Esta variable no tiene por qué ser una cadena de caracteres. JSTL utiliza el método erreur.toString() para insertar el valor de la variable «error». En lugar de la notación ${error}, también se puede utilizar la etiqueta <c:out value="${error}"/>.

Volviendo a nuestro ejemplo de visualización de errores:

  • el controlador incluirá en la solicitud enviada a la página JSP un ArrayList de mensajes de error, es decir, un ArrayList de objetos String: request.setAttribute("errores", errores), donde «errores» es el ArrayList;
  • debido al atributo items="${errores}", la página JSP buscará un atributo llamado «errores», sucesivamente en la consulta, la sesión y la aplicación. Lo encontrará en la solicitud: request.getAttribute("errores") devolverá el ArrayList colocado en la solicitud por el controlador;
  • la variable erreur del atributo var="error" apuntará, por lo tanto, al elemento actual de ArrayList, es decir, a un objeto String. El método erreur.toString() insertará el valor de este String —en este caso, un mensaje de error— en el flujo HTML de la página.

Los objetos de la colección procesada por la etiqueta <forEach> pueden ser más complejos que simples cadenas de caracteres. Tomemos el ejemplo de una página JSP que muestra una lista de artículos:

1
2
3
4
5
6
7
            <c:forEach var="article" items="${listarticles}">
                <tr>
                    <td><c:out value="${article.nom}"/></td>
                    <td><c:out value="${article.prix}"/></td>
                    <td><a href="<c:url value="?action=infos&id=${article.id}"/>">Infos</a></td>
                </tr>
     </c:forEach>

donde [listarticles] es un ArrayList de objetos de tipo [Article], que suponemos que es un Javabean con los campos [id, nom, prix, stockActuel, stockMinimum], y cada uno de estos campos cuenta con sus métodos get y set. El objeto [listarticles] fue incluido en la solicitud por el controlador. La página anterior JSP lo recuperará en el atributo items de la etiqueta forEach. Por lo tanto, el objeto actual «article» (var="article") hace referencia a un objeto de tipo [Article]. Consideremos la etiqueta de la línea 3:

<c:out value="${article.nom}"/>

¿Qué significa ${article.nom}? En realidad, varias cosas, dependiendo de la naturaleza del objeto «artículo». Para obtener el valor de article.nom, la página JSP intentará dos cosas:

  1. article.getNom() —fíjate en la ortografía de getNom— para recuperar el campo «nombre» (estándar JavaBean)
  2. article.get("nombre")

Por lo tanto, el objeto [article] puede ser un bean con un campo «nombre» o un diccionario con una clave «nombre».

No hay límites en la jerarquía del objeto procesado. Así, la etiqueta 

<c:out value="${individu.enfants[1].nom}"/>

permite procesar un objeto [individu] del siguiente tipo:

class Individu{
    private String nom;
    private String prénom;
    private Individu[] enfants;
     // métodos del estándar JavaBean
    public String getNom(){ return nom;}
    public String getPrénom(){ return prénom;}
    public Individu getEnfants(int i){ return enfants[i];}
}

Para obtener el valor de ${individu.enfants[1].nombre}, la página JSP intentará varios métodos, entre ellos este, que tendrá éxito:

individu.getEnfants(1).getNom(), donde «individuo» se refiere a un objeto de tipo «Individuo».

8.0.2. Instalar y explorar la biblioteca JSTL

Las explicaciones dadas anteriormente serán suficientes para la aplicación que nos interesa, pero la biblioteca de etiquetas JSTL ofrece otras etiquetas además de las presentadas. Para descubrirlas, se puede instalar un tutorial incluido en el paquete de la biblioteca.

Utilizaremos la implementación JSTL 1.1 del proyecto [Jakarta Taglibs], disponible en la URL [http://jakarta.apache.org/taglibs/] (mayo de 2006):

El archivo zip descargado tiene un contenido similar al siguiente:

Image

Los dos archivos con la extensión .war son archivos comprimidos de aplicaciones web:

  • standard-doc: documentación sobre las etiquetas JSTL
  • standard-examples: ejemplos de uso de las etiquetas

Vamos a implementar esta última aplicación en Tomcat. Iniciamos Tomcat mediante la opción correspondiente del menú [Démarrer], luego ingresamos la URL [http://localhost:8080] y seguimos el enlace [Tomcat Manager]:

Image

A continuación, aparece una página de autenticación. Iniciamos sesión con las credenciales manager / manager o admin / admin, tal como se mostró en el párrafo 2.3.3.

Image

Aparece una página que muestra las aplicaciones actualmente implementadas en Tomcat:

Image

Podemos agregar una nueva aplicación mediante los formularios que se encuentran al final de la página:

Image

Utilizamos el botón [Parcourir] para seleccionar un archivo .war que se va a implementar.

Image

La captura de pantalla no lo muestra, pero hemos seleccionado el archivo [standard-examples.war] de la distribución JSTL que descargamos. El botón [Deploy] guarda e implementa esta aplicación en Tomcat.

Image

La aplicación [/standard-examples] se ha implementado correctamente. La iniciamos:

Image

Se invita al lector a seguir los distintos enlaces que ofrece esta página cuando busque ejemplos de uso de las etiquetas JSTL.

La aplicación [standard-doc] se podrá implementar de la misma manera a partir del archivo [standard-doc.war]. Brinda acceso a información bastante técnica sobre la biblioteca JSTL. Resulta menos interesante para los principiantes.

8.0.3. Cómo usar JSTL en una aplicación web

En los ejemplos que vienen con la biblioteca JSTL 1.2, las páginas JSP tienen al inicio del archivo la siguiente etiqueta:

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

Ya nos hemos encontrado con esta etiqueta en el párrafo 8.1.1, y hemos dado una breve explicación:

  • [uri]: URI (Identificador Uniforme de Recursos), donde se encuentra la definición de las etiquetas utilizadas en la página. Esta etiqueta URI será utilizada por el servidor web cuando la página JSP se traduzca a código Java para convertirse en un servlet. También la utilizan las herramientas de desarrollo de páginas web para verificar que la sintaxis de las etiquetas utilizadas en la página sea correcta o para ofrecer sugerencias de escritura. Al comenzar a escribir una etiqueta, una herramienta que conozca la biblioteca puede sugerirle al usuario los atributos posibles para esa etiqueta.
  • [prefix]: prefijo que identifica estas etiquetas en la página

El URI [http://java.sun.com/jsp/jstl/core] no se puede utilizar si no se cuenta con conexión a la red pública de Internet. En ese caso, se puede guardar localmente el archivo de definición de etiquetas. Se incluyen varios de estos archivos con la distribución JSTL 1.2 en la carpeta [tld] (Tag Language Definition):

Image

JSTL es, de hecho, un conjunto de bibliotecas de etiquetas. Solo utilizaremos la biblioteca [c.tld], conocida como la biblioteca «core». Colocaremos el archivo [c.tld] mencionado anteriormente en la carpeta [WEB-INF] de nuestras aplicaciones:

Image

e incluiremos la siguiente etiqueta en nuestras páginas JSP para declarar el uso de la biblioteca «core»:

<%@ taglib uri="/WEB-INF/c.tld" prefix="c" %>

Si bien el uso de bibliotecas de etiquetas nos permite evitar incluir código Java en las páginas JSP, estas etiquetas, por supuesto, se traducen a código Java durante la conversión de la página JSP a un servlet de Java. Estas utilizan clases definidas en dos archivos [jstl.jar, standard.jar] que se encuentran en la carpeta [lib] de la distribución JSTL:

Image

Estos dos archivos se encuentran en la carpeta [WEB-INF/lib] de nuestras aplicaciones:

Image

Ahora contamos con las bases para abordar la siguiente versión de nuestra aplicación de ejemplo.

https://stahe.github.io
Este tutorial, escrito por Serge Tahé, se pone a disposición del público de acuerdo con los términos de la Creative Commons Reconocimiento – Sin uso comercial – Compartir igual 3.0 sin modificaciones.