23
May
10

JSP Custom Tags, Etiquetas personalizadas

Las JSP Custom Tags, son una herramienta muy poderosa la momento de separar la lógico de la presentación esto ayuda a que el diseñador (HTML+CSS) y el programador (JAVA) hagan mejor su trabajo.

Al principio pueden ser un poco extenso pero de igual forma mi útil:

  • Creamos una clase que lleva toda la funcionalidad de la etiqueta
  • Referenciamos dicha clase en el mxdescriptor.tld
  • Referenciamos al mxdescriptor.tld en la pagina jsp

la estructura del proyecto seria algo como así

Recordando el ejercicio06 (ver).
Tenemos un formulario donde escribimos 2 números y escogemos que operaciones queremos realizar con ellos.

Creando la etiqueta, hay dos formas de especificar la funcionalidad de una etiqueta (el código java) la primera implementando de la clase Tag y la otra heredando de la clase extendiendo de la clase TagSupport, yo utilizo la segunda opción.

el código de la etiqueta
Operaciones.java

//le damos un paquete
package ingeniods.tags;

//Importamos solo las clases necesarios
import javax.servlet.jsp.JspException;
import javax.servlet.jsp.JspTagException;
import javax.servlet.jsp.tagext.TagSupport;

//extendemos de TagSupport
public class Operaciones extends TagSupport{
	//declaramos las variables que vamos a usar
	private int n1;
	private int n2;

	private String suma="";
	private String resta="";
	private String multiplicacion="";
	private String division="";
	private String residuo="";

	//doStartTag, lo que queremos que suceda cuando invoque la etiqueta
	public int doStartTag() throws JspException {
       try{
       		pageContext.getOut().write("<p>");
       		pageContext.getOut().write("<b>Numero 1:"+n1+"</b><br>");
       		pageContext.getOut().write("<b>Numero 2:"+n2+"</b><br>");

       		if(suma.matches("si") | suma.matches("yes")){
       			pageContext.getOut().write("<b>La suma es: "+(n1+n2)+"</b><br>");
       		}
       		if(resta.matches("si") | resta.matches("yes")){
       			pageContext.getOut().write("<b>La resta es: "+(n1-n2)+"</b><br>");
       		}
       		if(multiplicacion.matches("si") | multiplicacion.matches("yes")){
       			pageContext.getOut().write("<b>La multiplicacion es: "+(n1*n2)+"</b><br>");
       		}
       		if(division.matches("si") | division.matches("yes")){
       			pageContext.getOut().write("<b>La division es: "+(n1/n2)+"</b><br>");
       		}
       		if(residuo.matches("si") | residuo.matches("yes")){
       			pageContext.getOut().write("<b>La residuo es: "+(n1%n2)+"</b><br>");
       		}
            pageContext.getOut().write("</p>");
        }catch(Exception  e){
            throw new JspTagException("Ocurrio una Exception en la creacion de la tag");
        }
        //al final retornamos si queremos evaluar el cuerpo de la etiqueta o si queremos ignorarlo
        return SKIP_BODY;
    }
    //que queremos que pase cuando se cierre la etiqueta
    public int doEndTag() throws JspException {
        //seguir evaluando la pagina
        return EVAL_PAGE;
    }

	// métodos sets de nuestros atributos
	public void setN1(int n1) {
		this.n1 = n1;
	}

	public void setN2(int n2) {
		this.n2 = n2;
	}

	public void setSuma(String suma) {
		this.suma = suma;
	}

	public void setResta(String resta) {
		this.resta = resta;
	}

	public void setMultiplicacion(String multiplicacion) {
		this.multiplicacion = multiplicacion;
	}

	public void setDivision(String division) {
		this.division = division;
	}

	public void setResiduo(String residuo) {
		this.residuo = residuo;
	}

       // métodos gets de nuestros atributos
	public int getN1() {
		return (this.n1);
	}

	public int getN2() {
		return (this.n2);
	}

	public String getSuma() {
		return (this.suma);
	}

	public String getResta() {
		return (this.resta);
	}

	public String getMultiplicacion() {
		return (this.multiplicacion);
	}

	public String getDivision() {
		return (this.division);
	}

	public String getResiduo() {
		return (this.residuo);
	}
}

tenemos otra tag que solo muestra un texto (no tiene atributos)
MiTag.java

package ingeniods.tags;
import javax.servlet.jsp.JspException;
import javax.servlet.jsp.JspTagException;
import javax.servlet.jsp.tagext.TagSupport;

public class MiTag extends TagSupport{

    public int doStartTag() throws JspException {
       try{
            pageContext.getOut().write("<b>Ingenio DS</b>");
        }catch(Exception  e){
            throw new JspTagException("Ocurrio una Exception en la creacion de la tag");
        }

        return SKIP_BODY;
    }

    public int doEndTag() throws JspException {
        return EVAL_PAGE;
    }
}

La descripción de la etiqueta, esta parte va en el archivo mxdescriptor.tld, esta dividida en 2 y recuerden que una etiqueta puede o no tener atributos a si que no es necesario declararlos pero si los declaras deben tener un método set o sea, si se declara un atributo atr1 en el código java debe existir un método setAtr1.

la estructura del mxdescriptor.tld es algo muy parecido a

mxdescriptor.tld

<?xml version="1.0" encoding="UTF-8"?>
<taglib version="2.0" xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation=
"http://java.sun.com/xml/ns/j2ee web-jsptaglibrary_2_0.xsd">
  <tlib-version>1.0</tlib-version>
  <short-name>mxdescriptor</short-name>
  <uri>/WEB-INF/mxdescriptor</uri>
  <description>
      Mis primeras etiquetas
  </description>
  <tag>
    <name>mitag</name>
    <tag-class>ingeniods.tags.MiTag</tag-class>
    <bodycontent>empty</bodycontent>
  </tag>
   <tag>
    <name>operaciones</name>
    <tag-class>ingeniods.tags.Operaciones</tag-class>
    <bodycontent>empty</bodycontent>
    <attribute>
   		<name>n1</name>
   		<required>true</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>int</type>
	</attribute>
	<attribute>
   		<name>n2</name>
   		<required>true</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>int</type>
	</attribute>
	<attribute>
   		<name>suma</name>
   		<required>false</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>String</type>
	</attribute>
	<attribute>
   		<name>resta</name>
   		<required>false</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>String</type>
	</attribute>
	<attribute>
   		<name>division</name>
   		<required>false</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>String</type>
	</attribute>
	<attribute>
   		<name>multiplicacion</name>
   		<required>false</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>String</type>
	</attribute>
	<attribute>
   		<name>residuo</name>
   		<required>false</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>String</type>
	</attribute>
  </tag>
</taglib>

La parte siguiente parte son lo nodos de configuración esto se entiende con el tiempo y si quieren busquen información en la pagina de la Sun, (mientras no se entienda se copia y se pega igual)

<?xml version="1.0" encoding="UTF-8"?>
<taglib version="2.0" xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation=
"http://java.sun.com/xml/ns/j2ee web-jsptaglibrary_2_0.xsd">
  <tlib-version>1.0</tlib-version>
  <short-name>mxdescriptor</short-name>
  <uri>/WEB-INF/mxdescriptor</uri>
  <description> Mis primeras etiquetas</description>
</taglib>

la descripción de la etiqueta MiTag que no tiene cuerpo ni atributos

  <tag>
    <name>mitag</name>
    <tag-class>ingeniods.tags.MiTag</tag-class>
    <bodycontent>empty</bodycontent>
  </tag>

la descripción de la etiqueta Operaciones que no tiene cuerpo pero si atributos, aunque n1 y n2 son obligatorios el resto no lo son.

  <tag>
    <name>operaciones</name>
    <tag-class>ingeniods.tags.Operaciones</tag-class>
    <bodycontent>empty</bodycontent>
    <attribute>
   		<name>n1</name>
   		<required>true</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>int</type>
	</attribute>
	<attribute>
   		<name>n2</name>
   		<required>true</required>
   		<rtexprvalue>false</rtexprvalue>
   		<type>int</type>
	</attribute>
	<attribute>
   		<name>suma</name>
   		<required>false</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>java.lang.String</type>
	</attribute>
	<attribute>
   		<name>resta</name>
   		<required>false</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>java.lang.String</type>
	</attribute>
	<attribute>
   		<name>division</name>
   		<required>false</required>
   		<rtexprvalue>false</rtexprvalue>
   		<type>java.lang.String</type>
	</attribute>
	<attribute>
   		<name>multiplicacion</name>
   		<required>false</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>java.lang.String</type>
	</attribute>
	<attribute>
   		<name>residuo</name>
   		<required>false</required>
   		<rtexprvalue>true</rtexprvalue>
   		<type>java.lang.String</type>
	</attribute>
  </tag>

por último las JSP donde utilizamos la etiqueta

tenemos una pagina jsp donde tenemos el formulario para recoger los datos
index.jsp

<html>
	<head>
		<title>HOLA JSP CUSTOM TAGS</title>
		<style type="text/css"><%@ include file="estilo.css"%></style>
	</head>
	<body bgcolor="#FFFFFF">
		<form  name="f2"  action="proceso.jsp" method="post">
			numero1:<input type="text" name="numero1"><br/>
			numero2:<input type="text" name="numero2"><br/>
			<input type="checkbox" name="suma" value="si">Suma<br/>
			<input type="checkbox" name="resta" value="si">Resta<br/>
			<input type="checkbox" name="multiplicacion" value="si">Multiplicacion<br/>
			<input type="checkbox" name="division" value="si">Division<br/>
			<input type="checkbox" name="residuo" value="si">Residuo<br/>
			<input type="submit" value="Calcular" >
		</form>
	</body>
</html>

tenemos una página jsp donde mostramos el resultado de dichas operaciones utilizando la etiqueta Operaciones

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!-- llamamos el mxdescriptor y le ponemos un apodo a todas las etiquetas descritas hay -->
<%@ taglib uri="/WEB-INF/mxdescriptor.tld" prefix="itags" %>
<html>
	<head>
		<title>HOLA JSP CUSTOM TAGS</title>
		<style type="text/css"><%@ include file="estilo.css"%></style>
	</head>
	<body>
		<!-- apodo:nombre_etiqueta  -->
		<itags:mitag />
		<!-- Como declaramos nq y n2 en el mxdescriptor como int debemos mandar un int  -->
		<itags:operaciones n1="<%=Integer.parseInt( request.getParameter("numero1"))%>"
						   n2="<%=Integer.parseInt( request.getParameter("numero2"))%>"
						   division="<%=request.getParameter("division")%>"
						   multiplicacion="<%=request.getParameter("multiplicacion")%>"
						   residuo="<%=request.getParameter("residuo")%>"
						   resta="<%=request.getParameter("resta")%>"
						   suma="<%=request.getParameter("suma")%>" />

		<form  name="f2"  action="index.jsp" method="post">
			<input type="submit" value="Volver" >
		</form>
	</body>
</html>

Por último utilizamos el siguiente estilo
Estilo.css

*{
	background-image:url(wallpaper1024x768.png);
	background-color:#CC0000;
	color:#FFFFFF;
}

recursos usados


3 Responses to “JSP Custom Tags, Etiquetas personalizadas”


  1. 1 edgar
    septiembre 6, 2010 a las 10:18 am

    una respuesta plis, o dame tu correo para tener contacto

    • septiembre 6, 2010 a las 10:35 am

      al inicio del blog esta mi correo y mi numero de telefono


Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s


I+Ds

Dudas consultas
Facebook
Twiter
Google +

Escribe tu dirección de correo electrónico para suscribirte a este blog, y recibir notificaciones de nuevas publicaciones por correo.

Únete a otros 348 seguidores

Ingenio DS en Facebook

Redes Sociales y Archivos

Entradas

mayo 2010
L M X J V S D
« Abr   Jun »
 12
3456789
10111213141516
17181920212223
24252627282930
31  

IngenioDS en twiter


A %d blogueros les gusta esto: