Accès rapide :
La vidéo
Le code de la vidéo
La plate-forme Java EE, et plus précisément l'API des JSP, permet de définir ses propres librairies de tags personnalisés. Un tel tag peut être vu comme une forme de composant Web réutilisable. Cette vidéo vous montre comment définir une tld (TagLib Definition), comment coder vos différents tags personnalisés et comment les utiliser dans vos pages JSP.
Voici le code de la classe de tag.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 |
package fr.koor.webstore.ihm.tags; import java.io.IOException; import javax.servlet.jsp.JspException; import javax.servlet.jsp.JspWriter; import javax.servlet.jsp.tagext.TagSupport; public class LoginForm extends TagSupport { private static final long serialVersionUID = 7947800060337250053L; private String action = ""; private String login = ""; private String password; public String getAction() { return action; } public void setAction(String action) { this.action = action; } public String getLogin() { return login; } public void setLogin(String login) { this.login = login; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } @Override public void release() { login = ""; password = ""; action = null; } @Override public int doStartTag() throws JspException { JspWriter out = pageContext.getOut(); try { out.print( "<form method='POST' " ); if ( action != null ) out.print( "action='" + action + "' " ); out.println( "style='border: 1px solid black; width: 60%; margin: auto;'>" ); out.println( "Login : " ); out.println( "<input name='txtLogin' value=\"" + login.replace( "\"", """ ) + "\" autofocus />" ); out.println( "<br/>" ); out.println( "Password : " ); out.println( "<input name='txtPassword' type='password' value=\"" + password.replace( "\"", """ ) + "\" />" ); out.println( "<br/><br/>" ); out.println( "<input type='submit' value='Connect' />" ); out.println( "<br/><br/>" ); } catch ( IOException exception ) { exception .printStackTrace(); } return 2; // State of the life cycle of my TagSupport } @Override public int doEndTag() throws JspException { JspWriter out = pageContext.getOut(); try { out.print( "</form>" ); } catch ( IOException exception ) { exception .printStackTrace(); } return 4; // State of the life cycle of my TagSupport } } |
Voici le code du fichier .tld (Tag Library Definition).
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
<?xml version="1.0" ?> <taglib version="2.0" xmlns="http://java.sun.com/xml/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> <jsp-version>2.3</jsp-version> <short-name>KoorLib</short-name> <display-name>Koor extra tags library</display-name> <uri>http://koor.fr/tld/extratags</uri> <tag> <name>LoginForm</name> <tagclass>fr.koor.webstore.ihm.tags.LoginForm</tagclass> <bodycontent>JSP</bodycontent> <attribute> <name>action</name> <required>false</required> <rtexprvalue>true</rtexprvalue> </attribute> <attribute> <name>login</name> <required>false</required> <rtexprvalue>true</rtexprvalue> </attribute> <attribute> <name>password</name> <required>false</required> <rtexprvalue>true</rtexprvalue> </attribute> </tag> </taglib> |
Et enfin, voici l'injection de notre nouveau tag dans une page JSP.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib uri="http://koor.fr/tld/extratags" prefix="koor" %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Login screen</title> <link rel="stylesheet" type="text/css" href="styles.css" /> </head> <body> <h1>Login screen</h1> <koor:LoginForm action="login" login="${login}" password="${password}" /> <br/> <div class="errorMessage">${errorMessage}</div> </body> </html> |
Améliorations / Corrections
Vous avez des améliorations (ou des corrections) à proposer pour ce document : je vous remerçie par avance de m'en faire part, cela m'aide à améliorer le site.
Emplacement :
Description des améliorations :