Curso de Java Server Faces y Ajax

Curso de Java Server Faces y Ajax
Manualdelalumno
<JSF2.0> <Ajax>
Docente:CdricSimon
Versin1.0 www.detodoprogramacion.com
CursodeJSP
Pagina2/70
ndice
ndice....................................................................................................................................................................................2 1 Introduccin al curso.........................................................................................................................................................5 1.1 Objetivo de este curso................................................................................................................................................5 1.2 Manual del alumno.....................................................................................................................................................5 1.3 Ejercicios prcticos....................................................................................................................................................5 1.4 Requisitos para atender a este curso........................................................................................................................5 1.5 Soporte despus del curso..........................................................................................................................................5 2 Introduccin a Java Server Faces.....................................................................................................................................6 2.1 Que es JSF?...............................................................................................................................................................6 2.2 Servidor y herramientas utilizados...........................................................................................................................6 2.3 Primera aplicacin.....................................................................................................................................................7 2.4 Primera pgina JSF...................................................................................................................................................8 2.5 Recuperando informaciones del cdigo Java...........................................................................................................9 3 Aplicaciones JSF.............................................................................................................................................................10 3.1 Qu es una aplicacin JavaServer Faces?............................................................................................................10 3.2 Modelo de componentes de interfaz de usuario.....................................................................................................10 3.3 Las clases de componentes de interfaz de usuario................................................................................................10 3.4 Conversin de Modelo.............................................................................................................................................13 3.5 Evento y el oyente de modelo..................................................................................................................................14 1.1 Validacin.................................................................................................................................................................15 3.6 Modelo de navegacin..............................................................................................................................................15 3.6.1 Configuracin de reglas de navegacin..............................................................................................................15 3.6.2 Reglas de navegacin implcitas.........................................................................................................................18 3.7 Backed Beans............................................................................................................................................................18 3.7.1 Crear una clase de bean de respaldo....................................................................................................................18 3.7.2 Configuracin de un Bean...................................................................................................................................19 3.8 Usando el EL unificada para referenciar Backed beans......................................................................................20 3.8.1 El Ciclo de Vida de una pgina JavaServer Faces..............................................................................................21 3.8.2 Fase de restauracin de vista...............................................................................................................................22 3.8.3 Fase de aplicacin de valores..............................................................................................................................23 3.8.4 Fase de validaciones de proceso..........................................................................................................................23 3.8.5 Fase de actualizacin de valores de modelo........................................................................................................24 3.8.6 Fase de invocacin de la aplicacin....................................................................................................................24 3.8.7 Fase de creacin de la respuesta..........................................................................................................................24 4 Expresiones EL................................................................................................................................................................26 4.1 Informacin general sobre EL................................................................................................................................26 4.2 Evaluacin inmediata y diferida.............................................................................................................................26 4.2.1 Evaluacin Inmediata..........................................................................................................................................26 4.2.2 Evaluacin diferida.............................................................................................................................................27 4.3 Valor y el mtodo de expresiones............................................................................................................................27 4.4 Operadores................................................................................................................................................................27 4.5 Palabras reservadas.................................................................................................................................................28 4.6 Ejemplos de uso de EL.............................................................................................................................................28 www.detodoprogramacion.com
CursodeJSP
Pagina3/70
5 JSTL - Libreras estndar Taglib....................................................................................................................................29 5.1 Introduccin..............................................................................................................................................................29 5.2 Core...........................................................................................................................................................................29 5.3 Iteracin....................................................................................................................................................................29 5.4 Acciones de URL......................................................................................................................................................30 5.5 Condicionales............................................................................................................................................................30 5.6 Formato de texto con capacidad I18N....................................................................................................................31 5.7 Acceso a bases de datos............................................................................................................................................32 5.8 La manipulacin de XML........................................................................................................................................33 6 Formularios......................................................................................................................................................................34 6.1 Formulario sencillo..................................................................................................................................................34 6.2 Formulario mas complejo........................................................................................................................................35 7 HtmlDataTable.................................................................................................................................................................37 8 Mensaje de error personalizados.....................................................................................................................................42 8.1 Lista de mensaje personalizados.............................................................................................................................42 8.2 Pgina de error personalizada:...............................................................................................................................42 9 Convertidores...................................................................................................................................................................43 9.1 Qu es un convertidor?..........................................................................................................................................43 9.2 Uso de los convertidores..........................................................................................................................................43 9.3 Convertidores incluidos...........................................................................................................................................43 9.3.1 Convertidor DateTime.........................................................................................................................................44 9.3.2 Convertidor de Nmero.......................................................................................................................................44 9.4 Convertidores personalizados.................................................................................................................................46 10 Validadores.....................................................................................................................................................................49 10.1 Uso y Creacin de los validadores........................................................................................................................49 10.2 Validadores incluidos.............................................................................................................................................49 10.3 Validacin a nivel de aplicacin............................................................................................................................49 10.4 Validadores personalizados...................................................................................................................................50 10.5 Validador en Backed Bean....................................................................................................................................51 11 Componentes personalizados.........................................................................................................................................52 11.1 Creacin de componentes personalizados para JSP...........................................................................................52 11.1.1 El Componente..................................................................................................................................................53 11.1.2 Renderer............................................................................................................................................................54 11.1.3 Tag.....................................................................................................................................................................56 11.1.4 Inline Renderer .................................................................................................................................................58 11.2 Componentes personalizados para Facelets........................................................................................................59 12 Introduccin a Ajax.......................................................................................................................................................61 12.1 Definicin y uso.......................................................................................................................................................61 12.2 Marcos de trabajo..................................................................................................................................................61 13 Ajax con Java.................................................................................................................................................................62 13.1 Llamada Ajax con HTML.....................................................................................................................................62 13.2 Llamada Ajax con Java.........................................................................................................................................63 13.2.1 Servlet para Ajax...............................................................................................................................................63
CopyrightCdricSimon,2009 Versin1.0 Reproduccinprohibida
www.detodoprogramacion.com
CursodeJSP
Pagina4/70
13.3 Ajax y seguridad.....................................................................................................................................................65 14 Componentes JSF para Ajax........................................................................................................................................66 14.1 Cmo JSF y Ajax pueden trabajar juntos?.......................................................................................................66 14.2 Utilizar el (Ajax) JavaScript en su pgina JSF....................................................................................................66 14.2.1 Pros....................................................................................................................................................................66 14.2.2 Contras..............................................................................................................................................................66 14.3 Poner su cdigo de Ajax JavaScript en los componentes JSF............................................................................66 14.3.1 Pros....................................................................................................................................................................66 14.3.2 Contras..............................................................................................................................................................66 14.4 Aprovechar la creciente coleccin de marcos de trabajo Ajax JSF..................................................................67 14.4.1 Pros....................................................................................................................................................................67 14.4.2 Contras..............................................................................................................................................................67 14.5 Utilizar el nuevo tag <f:ajax>................................................................................................................................67 14.5.1 Pros....................................................................................................................................................................67 14.5.2 Contras..............................................................................................................................................................67 14.5.3 Por qu el Ajax en JSF?...................................................................................................................................67 14.5.3.1 Ventajas de un enfoque especfico JSF Ajax.............................................................................................67 14.5.4 Uso del tag <f:ajax>..........................................................................................................................................68 14.5.4.1 Ejemplo sencillo.........................................................................................................................................68 14.5.4.2 renderer: Especificacin de los elementos de actualizacin en el cliente..................................................69 14.5.4.3 execute: Especificacin de los elementos a procesar en servidor..............................................................69 14.5.4.4 event: mencionar a cual evento de usuario debe disparar la llamada Ajax................................................70
CopyrightCdricSimon,2009
Versin1.0
Reproduccinprohibida
CursodeJSP
Pagina5/70
1 Introduccinalcurso
1.1 Objetivodeestecurso
EnestecursovamosaaprenderellenguajeJSFquenospermitircrearpginaswebdinmicas.
1.2 Manualdelalumno
Estemanualdelalumnoesunaayudaparaelalumno,paratengaunrecuerdodelcurso.Estemanual contieneunresumendelasmateriasquesevanaestudiarduranteelcurso,peroelalumnodeberade tomarnotaspersonalesparacompletasestemanual.
1.3 Ejerciciosprcticos
Paracaptarmejorlateora,seharnmuchosejerciciosconlosalumnos,paraprobarlateorayverificar laintegracindelamateria. Tambin,elalumnopodrcopiarsuscdigosenundisquetealfindelcursoparallevarse,confinde seguirlaprcticaensuhogar.
1.4 Requisitosparaatenderaestecurso
UnabuenconocimientodeloslenguajesJava,JSP,HTML,yJavascriptesrequeridaparaseguireste curso.LacreacinyelmanejodeobjetosJavaascomoelJSPestnconsideradacmoasimiladoantes deempezarestecurso. Sielalumnotienedificultadesenunuotrocapitulo,eldebesentirselibredepedirexplicaciones adicionalesalprofesor. Perosiaparecequeelalumnonoposeelosrequisitosmnimosparaestecurso,porrespetoalosotros alumnosqueyaposeenestamateria,elalumnopodrasertrasladoparaotrocursoenelfuturo,cuando elcumplirconlosrequisitos.
Versin1.0
CursodeJSP
Pagina6/70
2 IntroduccinaJavaServerFaces
2.1 QueesJSF?
JavaServerFaces(JSF)esuntecnologayframeworkparaaplicacionesJavabasadasenwebque simplificaeldesarrollodeinterfacesdeusuarioenaplicacionesJavaEE. JSFusaJavaServerPages(JSP)comolatecnologaquepermitehacereldesplieguedelaspginas,pero tambinsepuedeacomodaraotrastecnologascomoXUL. JSFincluye: UnconjuntodeAPIspararepresentarcomponentesdeunainterfazdeusuarioyadministrarsu estado,manejareventos,validarentrada,definirunesquemadenavegacindelaspginasydar soporteparainternacionalizacinyaccesibilidad. Unconjuntopordefectodecomponentesparalainterfazdeusuario. DosbibliotecasdeetiquetaspersonalizadasparaJavaServerPagesquepermitenexpresaruna interfazJavaServerFacesdentrodeunapginaJSP. Unmodelodeeventosenelladodelservidor. Administracindeestados. Beansadministrados. LaespecificacindeJSFfuedesarrolladaporlaJavaCommunityProcess VersionesdeJSF: JSF1.0(11032004)lanzamientoinicialdelasespecificacionesdeJSF. JSF1.1(27052004)lanzamientoquesolucionabaerrores.Sincambiosenlasespecificaciones nienelrenderkitdeHTML. JSF1.2(11052006)lanzamientoconmejorasycorreccindeerrores. JSF2.0(12082009)ltimolanzamiento. LasprincipalesimplementacionesdeJSFson: JSFReferenceImplementationdeSunMicrosystems. MyFacesproyectodeApacheSoftwareFoundation. RichFaces ICEfacesContienediversoscomponentesparainterfacesdeusuariosmsenriquecidas,tales comoeditoresdetextoenriquecidos,reproductoresdemultimedia,entreotros. jQuery4jsfContienediversoscomponentessobrelabasedeunodelosmspopularesframework javascriptjQuery.
2.2 Servidoryherramientasutilizados
JavaServerFaces2.0esunatecnologanueva,ynecesitalasltimasversionesdelasherramientasde desarrolloyservidoreswebparapoderusarla. Aniveldeherramientas,lasmsutilizadassonEclipseyNetBeans.EnelcursousaremosNetBeans versin6.8oarriba. Aniveldeservidoresweb,servidorescomoApacheTomcat6,Jboss5,oGlassFish3soportanJSF2.0. EnelcursousaremosGlassFish3quevieneincluidoconNetBeans.
Versin1.0
CursodeJSP
Pagina7/70
2.3 Primeraaplicacin
PrimerovamosainstalarNetBeansycrearunnuevoproyecto.
AgregamoslalibreraJSF2.0alservidor.
Versin1.0
CursodeJSP
Pagina8/70
Iniciamoselservidorwebydesplegamoslaaplicacin. Miramoselresultadoenhttp://localhost:8080/CursoJSFwar
PorelmomentosoloestamosmirandoaunapginaJSP,nadadeJSF.
2.4 PrimerapginaJSF
LaspginasJSFsonpginasJSPconunaslibrerasTaglibadicionales. Ademas,laspginasJSPnosellamandirectamente,perosellamanatravsdelmotorJSF.Parallamar alapginaJSF,bastaconagregar/faces/anteselnombredelapgina. http://localhost:8080/CursoJSFwar/faces/index.jsp Comolovemos,unapginaJSP(sincdigoJSF)puedeserllamadasinproblema. Laconfiguracindelreenvosepuedepersonalizar(porcarpetay/oporextensin)enweb.xml: <servlet>
<servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>/faces/*</url-pattern> </servlet-mapping>
CuandocreamosunanuevapginaJSF,podemosescogerentredostiposdesintaxis:FaceletsoJSP. FaceletsusaunformatoXML(XHTML),yJSPusa...el formatoJSP. ElJSFusapginasJSPoXHTML,unarchivode configuracinXML(facesconfig.xml),yJavaPOJO's. ApartirdeJSF2.0,elformatoXMLeselestndar. Agregamoselarchivodeconfiguracin.
Versin1.0
CursodeJSP
Pagina9/70
Ahoraquetenemostodolisto,creamosnuestraprimerapginaJSF,usandolaopcinJSP:
<%@page contentType="text/html" pageEncoding="UTF-8"%> <%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%> <%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <f:view> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <title>Mi primera pagina JSP</title> </head> <body> <h1><h:outputText value="Hola alumno!"/></h1> </body> </html> </f:view>
ElcdigoJSFenlapginaJSPsedebeencontrarentrelostags<f:view>y</f:view>. Comopodemosver,seincluyenlasdoslibrerasTaglib,queseusanluego,conlasetiquetas<f:>y<h:>. SiusamoselformatoXHTML,todoelcontenidoseconsideraJSF.

<?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"> <h:body> <h1>Hello alumno !!!</h1> </h:body> </html>
Labiblioteca<h:>contieneequivalentesdelHTML,yaseaformularios,botones,cajasdetexto, imgenes,etc... EnelfuturousaremoslosFaceletsynomaselJSP.
2.5 RecuperandoinformacionesdelcdigoJava
VamosacrearunaclaseJava(JSFBackedBean)HelloyllamarladesdenuestrapginaJSF.
package curso; import javax.faces.bean.ManagedBean; import javax.faces.bean.RequestScoped; @ManagedBean(name="Hello") @RequestScoped public class Hello { public Hello() { } public String getNombre(){ return "Cedric"; } }
Ymodificamoslapginaindex.xhtml:
<h1>Hello #{Hello.getNombre()} !!!</h1>
EnelfuturousaremoselformatoXHTML,ynoincluirlasetiquetas<xml>,<DOCTYPE>ni<html>, quesernlossiguientes:
<?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" >
Versin1.0
CursodeJSP
Pagina10/70
3 AplicacionesJSF
3.1 QuesunaaplicacinJavaServerFaces?
Ensumayorparte,unaaplicacinJavaServerFacesescomocualquierotraaplicacinJavaWeb.Una aplicacintpicadeJavaServerFacesincluyelassiguientespiezas: Unconjuntodepginasweb,enlaqueloscomponentesdeinterfazdeusuariosonestablecidos. Unconjuntodebibliotecasdeetiquetasproporcionaretiquetasparaaadircomponentesde interfazdeusuarioalapginaweb. UnconjuntodeBackedBean,quesonJavaBeanscomponentesquedefinenlaspropiedadesy funcionesdeloscomponentesdelainterfazdeusuarioenunapgina. Opcionalmente,unoomsficherosdeconfiguracindelaaplicacinderecursos(comofaces config.xmlfile),quedefinenlasnormasdenavegacindelapginayconfiguralosbeansyotros objetospersonalizados,talescomocomponentespersonalizados. Undescriptordedespliegue(unarchivoweb.xml). Esposiblequeunconjuntodeobjetospersonalizadoscreadosporeldesarrolladordeaplicaciones. Estosobjetospuedenincluircomponentespersonalizados,validadores,convertidores,olos oyentes. Unconjuntodeetiquetaspersonalizadaspararepresentarlosobjetospersonalizadosenla pgina.
3.2 Modelodecomponentesdeinterfazdeusuario
JavaServerFacescomponentesdeinterfazdeusuariosonlosbloquesdeconstruccindevistade JavaServerFaces. JavaServerFacescomponentesdeinterfazdeusuariosonelementosconfigurables,reutilizablesque componenlainterfazdeusuariodeaplicacionesJavaServerFaces.Uncomponentepuedesersimple, comounbotn,opuedensercompuestos,talescomounatabla,compuestademltiplescomponentes. LatecnologaJavaServerFacesproporcionaunaricaarquitecturadecomponentesflexiblesqueincluye losiguiente: UnconjuntodeclasesUIComponentparaespecificarelestadoyelcomportamientodelos componentesdelainterfazdeusuario Unmodeloderepresentacinquedefineelmododehacerloscomponentesdevariasmaneras Uneventodeescuchayelmodeloquedefinecmomanejarloseventosdeloscomponentes Unmodelodeconversinquedefinecmoregistrarlosconvertidoresdedatosenuncomponente Unmodelodevalidacinquedefinecmoregistrarvalidadoresenuncomponente Estaseccindescribebrevementecadaunadeestaspiezasdelaarquitecturadecomponentes.
3.3 Lasclasesdecomponentesdeinterfazdeusuario
LatecnologaJavaServerFacesproporcionaunconjuntodeclasesdecomponentesdeinterfazdeusuario ydecomportamientoasociadosalasinterfacesqueespecificantodaslasfuncionalidaddelos componentesdeinterfazdeusuario,comocomponentedeparticipacindelestado,manteneruna referenciaalosobjetos,yuneventodeconduccinymanejodelaprestacindeunconjuntode componentesestndar.
Versin1.0
CursodeJSP
Pagina11/70
Lasclasesdecomponentessontotalmenteextensible,permitiendoalosescritoresdecomponentespara crearsuspropioscomponentespersonalizados.Creacindecomponentespersonalizadosesuntema avanzadoqueveremosmstarde. Laclasebaseabstractaparatodosloscomponentesdeinterfazdeusuarioes javax.faces.component.UIComponent. LasclasesdecomponentesdeinterfazdeusuarioamplianlaclaseUIComponentBase,(unasubclasede laclaseUIComponent),quedefineelestadopordefectoyelcomportamientodeuncomponentede interfazdeusuario.Elsiguienteconjuntodeclasesdecomponentesdeinterfazdeusuarioseincluyecon latecnologaJavaServerFaces: UIColumn:RepresentaunasolacolumnadedatosenuncomponenteUIData. UICommand:Representauncontrolqueiniciaaccionescuandoseactiva. UIData:Representaunenlacededatosaunacoleccindedatosrepresentadosporunainstancia dataModel. UIForm:Encapsulaungrupodecontrolesqueenviardatosalaaplicacin.Estecomponentees anlogoalaetiquetadeformularioenHTML. UIGraphic:Muestraunaimagen. UIInput:Tomadeentradadedatosdeunusuario.EstaclaseesunasubclasedeUIOutput. UIMessage:Muestraunmensajedeerrortraducidos. UIMessages:Muestraunconjuntodemensajesdeerrortraducidos. UIOutcomeTarget:Muestraunhipervnculoenlaformadeunvnculoounbotn. UIOutput:Muestralasalidadedatosenunapgina. UIPanel:administraeldiseodesuscomponentesnio. UIParameter:Representalosparmetrosdesustitucin. UISelectBoolean:Permitealusuarioestablecerunvalorbooleanoenuncontroldeselecciny anulacindeella.EstaclaseesunasubclasedelaclaseUIInput. UISelectItem:Representaunsoloelementoenunconjuntodeelementos. UISelectItems:Representatodounconjuntodeelementos. UISelectMany:Permitealusuarioseleccionarvarioselementosdeungrupodeelementos.Esta claseesunasubclasedelaclaseUIInput. UISelectOne:Permitealusuarioseleccionarunelementodeungrupodeelementos.Estaclase esunasubclasedelaclaseUIInput. UIViewParameter:Representalosparmetrosdeconsultaenunasolicitud.Estaclaseesuna subclasedelaclaseUIInput. UIViewRoot:Representalarazdelrboldecomponentes. AdemsdeampliarUIComponentBase,lasclasesdecomponentetambinaplicarunaomsinterfaces decomportamiento,cadaunodeloscualesdefineciertocomportamientodeunconjuntodecomponentes cuyasclasesimplementanlainterfaz. Estasinterfacesdecomportamientosonlassiguientes: ActionSource:Indicaqueelcomponentepuededesencadenaruneventodeaccin.Estainterfaz estdiseadoparautilizarseconcomponentesbasadosenlatecnologaJavaServerFaces1.1_01 yversionesanteriores. ActionSource2:ExtiendeActionSource,yporlotantoproporcionalamismafuncionalidad.Sin embargo,sepermitealoscomponentesautilizarelELunificadocuandosehacereferenciaalos mtodosparacontrolarloseventosdeaccin. EditableValueHolder:ExtiendeValueHolderyespecificalascaractersticasadicionalesparalos componentesmodificable,comolavalidacinyemitirloseventosdecambiodevalor. NamingContainer:losmandatosquecadacomponentederazenestecomponentetieneuna identificacinnica. StateHolder:Indicaqueuncomponentehaestadoquedebenguardarentrelassolicitudes.
CursodeJSP
Pagina12/70
ValueHolder:Indicaqueelcomponentemantieneunvalorlocal,ascomolaposibilidadde accederalosdatosenelniveldemodelo. SystemEventListenerHolder:MantieneunalistadecasosSystemEventListenerparacadatipo deSystemEventdefinidoporesaclase. ClientBehaviorHolder:aadelacapacidaddeunirloscasosClientBehaviorcomounasecuencia decomandosreutilizables.
CadaetiquetapersonalizadadefinidaenelestndarHTMLhacerkitsecomponedelafuncionalidadde loscomponentes(definidosenlaclaseUIComponent)ylaprestacindeatributos(definidosporlaclase Renderer). ListadeetiquetasUIComponent

Tag column Funciones Representa una columna de datos en un componente UIData Enva un formulario para la solicitud Rendered As A column of data in an HTML table Apariencia Una columna de una tabla
commandButton
An HTML <input type=type> Un botn element, where the type value can be submit, reset, or image An HTML <a href> element Un hipervnculo
commandLink
Enlaces a otra pgina o ubicacin en una pgina Representa un contenedor de datos Representa una forma de entrada (etiquetas internas de la forma recibir los datos que se presentar con el formulario) Muestra una imagen Permite a un autor de la pgina incluir una variable oculta en una pgina
dataTable
An HTML <table> element
Una tabla que se pueden actualizar de forma dinmica No aparece
form
An HTML <form> element
graphicImage inputHidden
An HTML <img> element An HTML <input type=hidden> element
Una imagen No aparece
inputSecret
Permite al usuario An HTML <input type=password> Un campo de texto, que muestra una fila introducir una cadena sin la element de estrellas en cadena aparece en claro en lugar de la cadena el campo real que haya entrado Permite al usuario introducir una cadena Permite a un usuario introducir una cadena de varias lneas Muestra un mensaje localizado Muestra los mensajes localizados Muestra un mensaje localizado Muestra un componente anidado como una etiqueta para un campo de entrada especificado Enlaces a otra pgina o ubicacin en una pgina sin An HTML <input type=text> element An HTML <textarea> element Un campo de texto Un campo de texto de varias lineas Una cadena de texto Una cadena de texto Texto sin formato Texto sin formato
inputText inputTextarea
message messages outputFormat outputLabel
An HTML <span> tag if styles are used A set of HTML <span> tags if styles are used Plain text An HTML <label> element
outputLink
An HTML <a> element
Un hipervnculo
Versin1.0
CursodeJSP
que se genere un evento de accin outputText panelGrid panelGroup Muestra una lnea de texto Muestra una tabla Grupos de un conjunto de componentes en uno de los padres Plain text An HTML <table> element with <tr> and <td> elements A HTML <div> or <span> element
Pagina13/70
Texto sin formato Una tabla Una fila de una tabla de
selectBooleanCheck Permite a un usuario cambiar An HTML <input type=checkbox> Una casilla de box el valor de una opcin element. verificacin boleana selectItem Representa un elemento en An HTML <option> element una lista de elementos en un componente UISelectOne Representa una lista de elementos en un componente UISelectOne A list of HTML <option> elements A set of HTML <input> elements of type checkbox No aparece
selectItems
No aparece
selectManyCheckbox Muestra un conjunto de casillas de verificacin de que el usuario puede seleccionar varios valores selectManyListbox
Un conjunto de casillas de verificacin Un cuadro de lista
Permite al usuario An HTML <select> element seleccionar varios elementos de un conjunto de elementos, todos muestran a la vez Permite al usuario An HTML <select> element seleccionar varios elementos de un conjunto de elementos Permite a un usuario para seleccionar un elemento de un conjunto de elementos, todos muestran a la vez Permite a un usuario para seleccionar un elemento de un conjunto de elementos Permite a un usuario para seleccionar un elemento de un conjunto de elementos An HTML <select> element
selectManyMenu
Un cuadro combinado desplazable Un cuadro de lista
selectOneListbox
selectOneMenu
An HTML <select> element
Un cuadro combinado desplazable Un conjunto de botones de radio
selectOneRadio
An HTML <input type=radio> element
3.4 ConversindeModelo
UnaaplicacinJavaServerFaces,opcionalmente,sepuedeasociarconuncomponentedeservidorde datosdeobjetossecundarios.EsteobjetoesuncomponenteJavaBeans,comoungranoderespaldo.Una aplicacinobtieneyestableceelobjetodedatosparauncomponentellamandoalaspropiedadesde objetoapropiadoparaesecomponente. Cuandouncomponenteestasociadoaunobjeto,laaplicacintienedospuntosdevistadelosdatosdel componente: Elpuntodevistadelmodelo,enelqueserepresentanlosdatoscomotiposdedatos,talescomo intolong. Lavistadepresentacin,enelqueserepresentanlosdatosdeunamaneraquepuedeserledoo modificadoporelusuario.Porejemplo,unjava.util.Datepuedeserrepresentadacomouna cadenadetextoenelformatomm/dd/aaocomounconjuntodetrescadenasdetexto. LaimplementacindeJavaServerFacesconvierteautomticamentedatosdeloscomponentesentre estosdospuntosdevistacuandolapropiedaddebeanasociadosconelcomponentedeunodelostipos soportadosporlosdatosdelcomponente.
CursodeJSP
Pagina14/70
Porejemplo,siuncomponentedeUISelectBooleanseasociaconunapropiedaddebeande java.lang.Booleantipo,laimplementacinJavaServerFacesseconvertirautomticamentelosdatosdel componentedelacadenaenBoolean.Adems,algunosdatosdeloscomponentesdebenestarvinculadas alaspropiedadesdeuntipoparticular.Porejemplo,uncomponenteUISelectBooleandebeestar enlazadoaunapropiedaddetipobooleanojava.lang.Boolean. Avecespuedequedeseeconvertirlosdatosdeuncomponenteauntipodistintodeuntipoestndar,o puedequedeseeconvertirelformatodelosdatos.Parafacilitaresto,latecnologaJavaServerFacesle permiteregistrarlaaplicacinConverterencomponentesUIOutputycomponentescuyasclases UIOutputsubclase.SiseregistralaaplicacinConverterenuncomponente,laaplicacinConverter conviertelosdatosdelcomponenteentrelosdospuntosdevista. PuedeutilizarlosconvertidoresestndarsuministradosconlaimplementacinJavaServerFacesocrear supropioconvertidorpersonalizado.Lacreacindeconvertidorpersonalizadoesuntemaavanzadoque severmsadelante.
3.5 Eventoyeloyentedemodelo
JavaServerFaces2.0definetrestiposdeeventos:loseventosdeaplicacin,loseventosdelsistemaylos datosdeeventosdemodelo. Eventosdeaplicacinestnvinculadosaunaaplicacinenparticularysongeneradosporun UIComponent.Ellosrepresentanelestndardeeventosdisponiblesenversionesanterioresdela tecnologaJavaServerFaces. Unobjetodeeventoidentificaelcomponentequegenereleventoyalmacenainformacinsobreel evento.Parasernotificadodeunevento,unaaplicacindebeproporcionarunaimplementacindela clasedeescuchaydeberegistrarloenelcomponentequegeneraelevento.Cuandoelusuarioactivaun componente,porejemplo,hacerclicenunbotn,sedisparaunevento.Estohacequelaimplementacin JavaServerFacesparainvocarelmtododeescuchaqueprocesaelevento. JavaServerFacessoportadostiposdeeventosdeaplicacin:eventosdeaccinydevaloreventosde cambio. Uneventodeaccin(ActionEventclase)seproducecuandoelusuarioactivauncomponenteque implementeActionSource.Estoscomponentesincluyenbotonesyloshipervnculos. Uneventodecambiodevalor(ValueChangeEventclase)seproducecuandoelusuariocambiaelvalorde uncomponenterepresentadaporUIInputounodesussubclases.Unejemploeslaseleccindeuna casilladeverificacin,unaaccinqueresultaenelvalordelcomponenteestcambiandoatrue.Los tiposdecomponentesquepuedegenerarestetipodeeventossonlosUIInput,UISelectOne, UISelectMany,yloscomponentesdeUISelectBoolean.Valoreventosdecambiosondespedidosslosino sedetectaronerroresdevalidacin. LossucesosdelsistemasongeneradosporunobjetoenlugardeunUIComponent.Quesegeneran durantelaejecucindeunaaplicacinentiempospredefinidos.Sonaplicablesatodalaaplicacinen lugardeauncomponenteespecfico. Unmodelodedatosdeeventosseproducecuandoseseleccionaunanuevafiladeuncomponentede UIData. Lossucesosdelsistemaylosdatosdeeventosdemodelosontemasavanzadosquesemirarnmstarde.
CursodeJSP
Pagina15/70
1.1
Validacin
LatecnologaJavaServerFacessoportaunmecanismoparalavalidacindelosdatoslocalesdelos componentesmodificables(comoloscamposdetexto).Estavalidacinseproduceantesdequeelmodelo dedatoscorrespondienteseactualizaparaquecoincidaconelvalorlocal. Aligualqueelmodelodeconversin,elmodelodevalidacindefineunconjuntodeclasesestndarpara larealizacindecomprobacionesdevalidacindedatoscomunes.LaetiquetadeJavaServerFaces ncleobibliotecatambindefineunconjuntodeetiquetasquecorrespondenalasimplementaciones estndardeValidator. Lamayoradelasetiquetastienenunconjuntodeatributosparaconfigurarlaspropiedadesdel validador,talescomolosvaloresmximoymnimopermitidosparalosdatosdelcomponente.Los registrosdeautoreselvalidadorenuncomponenteporlaetiquetadeanidacindelvalidadordentrode laetiquetadelcomponente.
3.6 Modelodenavegacin
ElmodelodenavegacinJavaServerFaceshacequeseafcildedefinirydenavegacindelapgina paramanejarcualquierprocesamientoadicionalquesenecesitaparaelegirlasecuenciaenlaquese carganlaspginas. EnlatecnologaJavaServerFaces,lanavegacinesunconjuntodereglasparalaeleccindelapgina siguienteolavistaquesemostrardespusdeunaaccindeaplicacin,comocuandounbotno hipervnculosehaceclic. Estasnormassedeclaranenceroomsrecursosdeconfiguracindelaaplicacin,talescomo<faces config.xml>,utilizandounconjuntodeelementosXML.Laestructurapordefectodeunareglade navegacineselsiguiente: <navigationrule> <description> </description> <fromviewid></fromviewid> <navigationcase> <fromaction></fromaction> <fromoutcome></fromoutcome> <if></if> <toviewid></toviewid> </navigationcase> </navigationrule> EnJavaServerFaces2.0,lanavegacinpuedeserimplcitoodefinidosporelusuario.Lasreglasde navegacinimplcitasentranenjuegocuandolasnormasdenavegacinnoestndisponiblesenun archivodeconfiguracindelaaplicacinderecursos. 3.6.1
Configuracindereglasdenavegacin
Comoseexplicaenelmodelodenavegacin,lanavegacinesunconjuntodereglasparalaeleccindela siguientepginaquesemuestradespusdeunbotnouncomponentedehipervnculosehaceclic. Lasreglasdenavegacinsedefinenenelexpedientedesolicitudderecursosdeconfiguracin.

CursodeJSP
Pagina16/70
Cadaregladenavegacinespecificacmonavegardeunapginaaunconjuntodeotraspginas.La implementacindeJavaServerFaceseligelaregladenavegacinadecuadodeacuerdoalapginaque semuestraactualmente. Despusdelaregladenavegacinadecuadoesseleccionado,laeleccindequeparaaccederalapgina siguientedelapginaactualdependededosfactores: Elmtododeaccinqueseinvocacuandoelcomponentesehahechoclic Elresultadolgicoquesehacereferenciaporelcomponenteenlaetiqueta,ofuedevueltoporel mtododeaccin Elresultadopuedesercualquiercosaqueeldesarrolladordecide,perolatablaaquvanalgunos resultadosdeusocomnenaplicacionesweb.
Final success failure logon noresults
Loquesignificacomnmente Todohafuncionado.Iralapginasiguiente. Algoestmal.Iraunapginadeerror. Elusuariodebeiniciarsesinprimero.Iralapginadeiniciodesesin. Labsquedanoencontraronnada.Iralapginadebsquedadenuevo.
Normalmente,elmtododeaccinrealizaunprocesamientodelosdatosdelformulariodelapgina actual. Porejemplo,elmtodopodracomprobarsielnombredeusuarioylacontraseaintroducidaenel formulariodecoincidirconelnombredeusuarioycontraseaenelarchivo.Sicoinciden,elmtodo devuelveelxitodelosresultados.Delocontrario,devuelvelafaltaderesultados. Comodemuestraesteejemplo,tantoelmtodoutilizadoparaprocesarlaaccinylosresultados devueltossonnecesariasparadeterminarlapginapropiadeacceso. Heaquunaregladenavegacinquepodranserutilizadosconelejemploqueacabamosdedescribir:

<navigation-rule> <from-view-id>/logon.jsp</from-view-id> <navigation-case> <from-action>#{LogonForm.logon}</from-action> <from-outcome>success</from-outcome> <to-view-id>/storefront.jsp</to-view-id> </navigation-case> <navigation-case> <from-action>#{LogonForm.logon}</from-action> <from-outcome>failure</from-outcome> <to-view-id>/logon.jsp</to-view-id> </navigation-case> </navigation-rule>
EstaregladenavegacindefinelasposiblesmanerasdenavegardelogOn.jsp.Cadaelementode navegacincaso,defineunarutadenavegacinposibledelogOn.jsp.Lanavegacinprimercasosedice quesiLogonForm.logondevuelveunresultadodexito,entoncesstorefront.jspsetendracceso.La navegacinsegundocasosedicequelogOn.jspsevuelvenarepresentar,sivuelveLogonForm.logon fracaso. Laconfiguracindeunaaplicacin,elflujodelapginaconstadeunconjuntodereglasdenavegacin. Cadareglasedefineporelelementoderegladenavegacinenelarchivofacesconfig.xml.
Versin1.0
CursodeJSP
Pagina17/70
Cadaelementoderegladenavegacincorrespondeaunidentificadordelcomponentearbreodefinido porelfacultativodevistadeelementodeidentificacin.EstosignificaquecadaEstadodefinetodaslas posiblesmanerasdenavegardeunapginaespecialenlaaplicacin. Sinohayningnelementodelavistadeid,lasreglasdenavegacinsedefineenelelementodereglade navegacinseaplicanatodaslaspginasdelaaplicacin.LaconcordanciadepatronesviewIDde elementotambinpermitecomodn.Porejemplo,estedevistaIDdeelementodicequelareglade navegacinseaplicaatodaslaspginaseneldirectoriodelibros:

<from-view-id> / libros / * </ from-view-id>
Comoseindicaenlaregladenavegacinejemplo,unelementoderegladenavegacinpuedecontener ceroomselementosdenavegacincaso.Elelementodenavegacincaso,defineunconjuntodecriterios decoincidencia.Cuandosecumplenestoscriterios,laaplicacinsevayaalapginadefinidaporela verIDdeelementocontenidoenlanavegacindelmismoelementodecaso. Loscriteriossondefinidosporlanavegacinopcionalderesultadosydeelementosdeaccin.El resultadodeelementodefineunresultadolgico,comoelxito.Elelementodelaaccinmtodoutiliza unaexpresinparareferirseaunmtododeaccinquedevuelveunacadena,queeselresultadolgico. Elmtodorealizaalgunalgicaparadeterminarelresultadoydevuelveelresultado. Loselementosdenavegacincasodequesecotejarnconlosresultadosyelmtododeexpresineneste orden: Loscasosqueespecificalavezunresultadodevalorydevalordelaaccin.Amboselementos puedenserutilizadossielmtododeaccindevuelveresultadosdiferentesdependiendodel resultadodelatransformacinquerealiza. Loscasosqueespecificaslounvalorderesultado.Elelementoderesultadodebecoincidirconel resultadoyaseadefinidoporelatributodeaccindelcomponentedeUICommandoelresultado devueltoporelmtodomencionadoporelcomponentedeUICommand. Especificandoloscasosslounadevalordelaaccin.Estevalordebecoincidirconlaexpresin accinespecificadaporlaetiquetadelcomponente. Cuandosecomparacualquieradeestoscasos,elrboldecomponentesdefinidosporelaverelementode identificacinsernseleccionadosparalarepresentacin. UsodeNetBeansIDE,puedeconfigurarunaregladenavegacindelasiguientemanera: 1. DespusdeabrirsuproyectoenelIDENetBeans,expandaelnododelproyectoenelpanelde Proyectos. 2. AmpliarlasPginasWebyWebnodosINFdelnododelproyecto. 3. Hagadobleclicenfacesconfig.xml. 4. Despusdefacesconfig.xmlseabreenelpaneldeleditor,hagaclicenelpaneldeleditor. 5. SeleccioneJavaServerFaces,AddNavegacinartculo. 6. EnelcuadrodedilogoAgregarnavegacinartculo: Introduzcaobusquelapginaquerepresentaelpuntodevistadepartidadeestaregla denavegacin. HagaclicenAgregar. 7. Hagaclicdenuevoenelpaneldeleditor. 8. SeleccioneJavaServerFaces,UIAadirNavegacinasunto. 9. EnelcuadroAgregarnavegacinasuntodedilogo: DesdeelmenVer,seleccionelapginaquerepresentaelpuntodevistadepartidapara laregladenavegacin(enelpaso6a). (opcional)Enelcampodeaccin,escribaelmtododeaccinseinvocacuandoel componentequeseactivalanavegacinactiva.
CursodeJSP
Pagina18/70
3.6.2
(opcional)Enelcampoderesultados,escribalacadenaresultadolgicodequelas referenciascomponenteactivodesuatributodeaccin. DelaAmenVer,seleccioneobusquelapginaqueseabrirsiestecasodenavegacin esseleccionadoporelsistemadenavegacin. HagaclicenAgregar.
Reglasdenavegacinimplcitas
ApartirdeJavaServerFaces2.0,lasreglasdenavegacinimplcitaestndisponiblesparaaplicaciones deFacelets.Lasreglasdenavegacinimplcitaentrarenjuegosinohayreglasdenavegacinse configuranenlosarchivosdeconfiguracinderecursosdeaplicacin. Cuandoseagregauncomponentedeinterfazdeusuariocomouncomandoyasignaunapginacomoel valordesupropiedadlaaccin,elcontroladordenavegacinpordefectotratandecombinarunapgina adecuadadentrodelaaplicacin.

<h:commandButton value="Enviar" action="response">
Enelejemploanterior,elcontroladordenavegacinpordefectotratardelocalizarlapgina response.xhtmlynavegarhacial.
3.7 BackedBeans
UnaaplicacintpicadeJavaServerFacesincluyeunoomsbeansdeapoyo,cadaunodeellosesun JavaServerFacesgestionadosdebeanqueestasociadoconloscomponentesdelainterfazdeusuario utilizadosenunadeterminadapgina. LosbeansGestionadosonJavaBeanscomponentesquesepuedenconfigurarmediantelainstalacinde beangestionado,quesedescribeenConfiguracindeBeans.Estaseccinpresentalosconceptosbsicos sobrelacreacin,configuracinyusodesemillasdeapoyoenunaaplicacin. 3.7.1
Crearunaclasedebeanderespaldo
Ademsdedefinirunconstructorsinargumento,comotodosloscomponentesJavaBeansdebehacer, unaclasedebeanderespaldotambindefineunconjuntodepropiedadesdeloscomponentesdeinterfaz deusuarioy,posiblemente,unconjuntodemtodosquerealizanfuncionesdeuncomponente. Cadaunadelaspropiedadesdeloscomponentessepuedenenlazaraunadelassiguientes: Elvalordeuncomponente Unainstanciadecomponente Unejemplodelconvertidor Unejemplodeescucha Unejemplodevalidador Lasfuncionesmscomunesquelosmtodosdebackedbeanrealizarsonlassiguientes: Validarlosdatosdeuncomponente Manejodeuneventodisparadoporuncomponentede Realizacindetratamientoparadeterminarlasiguientepginaparaquelasolicituddebe navegar ComocontodosloscomponentesJavaBeans,unapropiedadconstadeuncampodedatosprivadosyun conjuntodemtodosdeacceso,comolomuestraestecdigo:
Versin1.0
CursodeJSP
UserNumber Integer = null; ... setUserNumber public void (Integer user_number) ( = userNumber user_number; ) getUserNumber public Integer () ( userNumber retorno; ) public String getResponse () ( ... )
Pagina19/70
Cuandounapropiedaddebeanestligadaalvalordeuncomponente,puedesercualquieradelostipos bsicosprimitivosynumricoocualquiertipodeobjetodeJavaparaquelaaplicacintengaaccesoaun convertidorapropiado.Porejemplo,unapropiedadpuedeserdetipofecha,silaaplicacintieneaccesoa unconvertidorquepuedeconvertireltipodefechaenunacadenayviceversa. Cuandounapropiedadseuneaunainstanciadelcomponente,eltipodelapropiedaddebeserelmismo queelobjetodecomponentes.Porejemplo,siunUISelectBooleanestligadoalapropiedad,la propiedaddebeaceptarydevolverunobjetoUISelectBoolean. Delmismomodo,silapropiedadestenlazadoaunconvertidor,validador,oeloyenteejemplo,la propiedaddebeserdelconvertidorcaso,validador,oeloyentetipo. 3.7.2
ConfiguracindeunBean
LatecnologaJavaServerFacessoportaunsofisticadoestablecimientoadministradoporlacreacinde bean,quepermitealosarquitectosdeaplicacionesparahacerlosiguiente: Configurarbeanssimpleyrbolesmscomplejodebeans Inicializarelbeanconlosvalores Ponerlosbeansenunmbitoparticular(mbitosdisponibles:request,view,session,application) ExponelosbeansalaELunificadaparaquelosautoresdepginassepuedeaccederaellos Elsiguienteejemplomuestraunejemplodearchivofacesconfig.xml:

<managed-bean> <managed-bean-name> UserNumberBean </ managed-bean-name> <managed-bean-class> guessNumber.UserNumberBean </ managed-bean-class> <managed-bean-scope> sesin </ managed-bean-scope> <managed-property> <property-name> mnimos </ propiedad name> <property-class> largo </ propiedad de clase> <valor> 0 </ value> </ managed-property> <managed-property> <property-name> <mximo / property-name> <property-class> largo </ propiedad de clase> <valor> 10 </ value> </ managed-property> </ managed-bean>
LaimplementacindeJavaServerFacesprocesala<managedbeanscope>elementoenelmomentode iniciodelaaplicacin.Cuandounbeanesllamadolaprimeravezdelapgina,secreaunainstancia. Unautordelapginapuedeaccederalaspropiedadesdebeandelasetiquetasdecomponentesenla pginautilizandoelELunificada,comosemuestraaqu:

<h:outputText value="#{UserNumberBean.minimum}"/>
Versin1.0
CursodeJSP
Pagina20/70
Tambinesposibleaprovecharlafuncindeanotacionesparaelbeanlogradoevitarlaconfiguracinde beangestionadoenarchivodeconfiguracinderecursosdeaplicacin. Ejemplo:
@ManagedBean(name = "Login") @RequestScoped public class Login {...}
3.8 UsandoelELunificadaparareferenciarBackedbeans
Paraobligaralosvaloresdelainterfazdeusuariodeloscomponentesypropiedadesdelosobjetosal apoyodebeanoderespaldoparahacerreferenciaalosmtodosdebeandeetiquetasdecomponentesde interfazdeusuario,losautoresdepginasutilizarellenguajedeexpresinunificada(EL)sintaxis definidaporJSP2.1. Lassiguientessonalgunasdelascaractersticasqueofreceestelenguaje: Evaluacindiferidadelasexpresiones Lacapacidaddeusarunaexpresindevalortantoparaleeryescribirdatos Expresindemtodos Estascaractersticassonespecialmenteimportantesparaapoyarelmodelodeinterfazdeusuario sofisticadocomponentequeofrecelatecnologaJavaServerFaces. EvaluacindiferidadelasexpresionesesimportanteporqueelciclodevidadeJavaServerFacesest divididoenfasesdistintas,demaneraqueelmanejodeeventosdecomponentes,laconversindedatosy validacin,ylapropagacindedatosalosobjetosexternos,serealizanenformaordenada.Laaplicacin debesercapazderetrasarlaevaluacindelasexpresiones,hastalafaseapropiadadelciclodevidase haalcanzado.Porlotanto,suetiquetadeatributossiempreutilizalasintaxisdelaevaluacindiferida, quesedistingueporeldelimitador#().ElCiclodeVidadeunapginaJavaServerFacesdescribeelciclo devidaendetalle. Conelfindealmacenardatosenlosobjetosexternos,casitodoslosatributosdeetiquetasJavaServer Facesutilizarexpresionesdevalorvalor,quesonexpresionesquepermitentantoobteneryestablecer datossobrelosobjetosexternos. Porltimo,algunosatributosdeetiquetadecomponentedeaceptarexpresionesmtodoquelosmtodos dereferenciaparacontrolarloseventosdecomponentes,ovalidaroconvertirlosdatosdelos componentes. ParailustrarunaetiquetadeJavaServerFacesusandoelELunificado,supongamosqueunaetiqueta deunasolicituddereferenciaaunmtodopararealizarlavalidacindeentradadeusuario:
<h:inputText id="userNo" value="#{UserNumberBean.userNumber}" validator="#{UserNumberBean.validate}" />
EstaetiquetaseuneelvalordelcomponenteuserNoparaelbeandelapropiedad UserNumberBean.userNumberutilizandounaexpresinvalue.Seutilizaunmtododeexpresinpara hacerreferenciaalmtododeUserNumberBean.validate,querealizalavalidacindevalorlocaldel componente.Elvalorlocalesloqueelusuarioentraenelcampocorrespondienteaestaetiqueta.Este mtodoseinvocacuandoseevalalaexpresin,queesdurantelafasedevalidacindelprocesodelciclo devida. CasitodoslosatributosdeetiquetasJavaServerFacesaceptarexpresionesdevalor.Ademsdelas propiedadesjudasdereferencias,expresionesdevalorpuedetambinlistasdereferencias,mapas, paneles,objetosimplcita,ylospaquetesderecursos.

CursodeJSP
Pagina21/70
Otrousodelasexpresionesdevalorvinculanteesunainstanciadelcomponenteaunapropiedadde backedbean.Unautordelapginahacereferenciaalapropiedaddelatributo:
<inputText binding="#{UserNumberBean.userNoComponent}" />
Esasetiquetasdecomponentesquelasexpresionesmtododeusosonlasetiquetasylasetiquetasde componentesUIInputcomponenteUICommand. 3.8.1
ElCiclodeVidadeunapginaJavaServerFaces
ElciclodevidadeunapginaJavaServerFacesesalgosimilaraladeunapginaJSP:Elclienterealiza unasolicitudHTTPdelapginayelservidorrespondeconlapginatraducidaaHTML.Sinembargo,el ciclodevidadeJavaServerFacesdifieredelciclodevidadeJSPenquesedivideenvariasfasespara apoyarelmodelodeinterfazdeusuariosofisticadocomponente.Estemodelorequierequeloselementos deserconvertidosyvalidados,eventosdeloscomponentessemanipulan,ylosdatosdeloscomponentes sepropagaalasjudasenunamaneraordenada. UnapginadeJavaServerFacesestambindiferentedeunapginaJSPenlaqueesrepresentadopor unrboldecomponentesdeinterfazdeusuario,denominadopuntodevista.Duranteelciclodevida,la implementacinJavaServerFacesdebeconstruirelpuntodevistaalconsiderarelestadoguardadode unapresentacinanteriordelapgina.Cuandoelclienteenvaunapgina,laimplementacin JavaServerFacesrealizavariastareas,talescomolavalidacindelaentradadedatosdelos componentesdelavistaylaconversindelosdatosdeentradaalostiposespecificadosenelladodel servidor. LaimplementacindeJavaServerFacesrealizatodasestastareascomounaseriedepasosenla solicituddeJavaServerFacesciclodevidaderespuesta.
DiagramadeflujodelasolicituddeFacesyrespuestadeFaces,incluyendoeleventodevalidacinyel procesamiento,manejodeerrores,elmodelodeactualizacin,lainvocacindelaaplicacin. Elciclodevidamanejaambostiposdesolicitudes:Lassolicitudesinicialesydevolucionesdedatos. Cuandounusuariohaceunasolicitudinicialdeunapgina,loellaestsolicitandolapginapor primeravez.Cuandounusuarioejecutaunadevolucindedatos,seleenvaelformularioquefiguraen

CursodeJSP
Pagina22/70
unapginaquefuepreviamentecargadoenelnavegadorcomoresultadodelaejecucindeunasolicitud inicial. Cuandoelciclodevidaseencargadelapeticininicial,sloseejecutalarestauracindevistayhacer quelasfasesderespuesta,porquenohayningunaentradadelusuariooaccionesparaelproceso.Porel contrario,cuandoelciclodevidamanejaunadevolucindedatos,ejecutatodaslasfases. Normalmente,laprimerasolicitudparaunapginaJavaServerFacestratadeuncliente,como resultadodehacerclicenunhipervnculoenunapginaHTMLqueenlazaconlapginadeJavaServer Faces. ParahacerunarespuestaqueesotrapginaJavaServerFaces,laaplicacincreaunanuevavisinyla almacenaenlainstanciaFacesContext,querepresentaatodalainformacincontextualasociadaconel procesamientodeunasolicitudentranteycrearunarespuesta.Laaplicacinseadquierereferenciasa objetosquenecesitalaopininysolicitaFacesContext.renderResponse,queobligaalaprestacin inmediatadelaopinindepasarporlarespuestaalafasedeprocesamientodelciclodevida,como indicanlasflechasetiquetadosRenderderespuestaeneldiagrama. Aveces,unaaplicacinpodranecesidaddereorientarlosrecursosadiferentesaplicacionesweb,como unservicioweb,ogenerarunarespuestaquenocontienecomponentesJavaServerFaces.Enestas situaciones,eldesarrolladordebesaltarselafasederenderizado(RenderFasederespuesta)llamando FacesContext.responseComplete.Estasituacintambinsemuestraeneldiagrama,estavezconlas flechasdelaetiquetarespuestacompleta. LapropiedaddelacurrentPhaseIDFacesContext,querepresentalafasequeseencuentra,debeser actualizadatanprontocomoseaposibleporlaaplicacin. LasituacinmscomnesqueuncomponenteJavaServerFacespresentaunasolicituddelapginade otroJavaServerFaces.Enestecaso,laimplementacinJavaServerFacesmanejalasolicitudy automticamentepasaatravsdelasfasesdelciclodevidapararealizarcualquierconversin necesaria,validacionesyactualizacindelosmodelos,yparagenerarlarespuesta. Losdetallesdelciclodevidaseexplicaenestaseccinestndestinadosprincipalmentepara desarrolladoresquenecesitanconocerdichainformacincomocuandovalidaciones,conversiones,ylos eventossongeneralmentetramitadasyloquepuedenhacerparacambiarcmoycundoselesda.Los autoresdepginasnotienenporquconocerlosdetallesdelciclodevida. 3.8.2
Fasederestauracindevista
CuandounasolicituddeunapginaJavaServerFacessehace,comocuandounenlaceounbotnse presiona,laimplementacinJavaServerFacescomienzalafasederestauracindevista. Duranteestafase,laimplementacinJavaServerFacesconstruyeelpuntodevistadelapgina,cables controladoresdeeventosylosvalidadoresdeloscomponentesenlavista,yguardalavistaenelejemplo FacesContext,quecontienetodalainformacinnecesariaparaprocesarunasolicitudnica.Todaslas etiquetasdecomponentesdelaaplicacin,loscontroladoresdeeventos,convertidoresyvalidadoresde teneraccesoalainstanciadeFacesContext. Silasolicituddelapginaesunasolicitudinicial,laimplementacinJavaServerFacescreaunavisin devacoenestaetapaylosavancesdelciclodevidaparahacerlafasederespuesta,duranteelcualla opinindevacosellenaconloscomponentesdereferenciadelasetiquetasenlapgina.
Versin1.0
CursodeJSP
Pagina23/70
Silasolicituddelapginaesunadevolucindedatos,unavistacorrespondienteaestapginayaexiste. Duranteestafase,laimplementacinJavaServerFacesrestauralavistamedianteelusodela informacindeestadoguardadaenelclienteoelservidor. 3.8.3
Fasedeaplicacindevalores
Despusdequeelrboldecomponentesqueserestablezca,cadacomponenteenelrboldelosextractos desunuevovalordelosparmetrosdelapeticinmedianteelusodesudecodificar(processDecodes()) mtodo.Elvalorsealmacenalocalmenteenelcomponente.Silaconversindelvalordefalla,un mensajedeerrorqueestasociadoconelcomponentesegenerayenlacolaenFacesContext.Este mensajesemostrardurantelafasededarrespuesta,juntoconloserroresdevalidacinresultantede lafasedevalidacindelproceso. SilosmtodosdescifrarodetectoresdeeventosllamadorenderResponseFacesContextenlainstancia actual,laimplementacinJavaServerFacessaltaalafasededarrespuesta. Silosacontecimientossehancoladuranteestafase,lasemisionesdeaplicacinJavaServerFaceslos acontecimientosalosoyentesinteresados. Sialgunoscomponentesdelapginatienensusatributosdeinmediatoestableceentrue,entoncesla validacin,laconversin,yloseventosrelacionadosconestoscomponentesserntratadosduranteesta fase. Enestepunto,silasolicitudtienequereorientarlosrecursosadiferentesaplicacioneswebodegenerar unarespuestaquenocontienecomponentesJavaServerFaces,puedellamara FacesContext.responseComplete. Alfinaldeestafase,loscomponentessefijanasusnuevosvalores,ylosmensajesyeventossehan puestoencola. Silapeticinactualseidentificacomounapeticinparcial,elcontextoparcialserecuperadelascaras decontextoyelmtododetransformacinparcialesaplicado. 3.8.4
Fasedevalidacionesdeproceso
Duranteestafase,laimplementacinJavaServerFacesprocesatodoslosvalidadoresregistradasenlos componentesenelrbol,mediantesuvalidacin((processValidators))mtodo.Seexaminael componentedeatributosqueespecificanlasnormasparalavalidacinycomparaestasnormasparael valorlocalalmacenadoparaelcomponente. Sielvalorlocalnoesvlido,laimplementacinJavaServerFacesaadeunmensajedeerrorala instanciaFacesContext,yelciclodevidaavanzadirectamentealafasededarrespuestaparaquela pginaserepresentaconelmensajedeerror.Sihuboerroresdeconversindelasolicituddeaplicarlos valoresdefase,losmensajesdeestoserrorestambinsemuestran. SialgunavalidarmtodosodetectoresdeeventosllamadorenderResponseenelFacesContextactual,la implementacinJavaServerFacessaltaalafasededarrespuesta. Enestepunto,silasolicitudtienequereorientarlosrecursosadiferentesaplicacioneswebodegenerar unarespuestaquenocontienecomponentesJavaServerFaces,puedellamara FacesContext.responseComplete.
Versin1.0
CursodeJSP
Pagina24/70
Silosacontecimientossehancoladuranteestafase,laimplementacinJavaServerFacesemisionesa oyentesinteresados. Silapeticinactualseidentificacomounapeticinparcial,elcontextoparcialserecuperadelascaras decontextoyelmtododetransformacinparcialesaplicado.Procesamientoparcialestcubiertoen JavaEE6Tutorial,VolumenII:Temasavanzados. 3.8.5
Fasedeactualizacindevaloresdemodelo
DespusdelaimplementacinJavaServerFacesdeterminaquelosdatossonvlidos,sepuederecorrer elrboldecomponentesyestablecerelservidorcorrespondientedelaspropiedadesdelobjetodeladoa losvaloreslocalesdeloscomponentes.LaimplementacindeJavaServerFacesactualizarslolas propiedadesjudasapuntadoporuncomponentedevalordeatributodeentrada.Silosdatoslocalesno puedenserconvertidosalostiposespecificadosporlaspropiedadesjudas,elciclodevidaavanza directamentealafasededarrespuestaparaquelapginaesreemitidaconerroresmostrados.Estoes similaraloquesucedeconloserroresdevalidacin. SilosmtodosupdateModelsocualquieroyentesllamadorenderResponseFacesContextenlainstancia actual,laimplementacinJavaServerFacessaltaalafasededarrespuesta. Enestepunto,silasolicitudtienequereorientarlosrecursosadiferentesaplicacioneswebodegenerar unarespuestaquenocontienecomponentesJavaServerFaces,puedellamara FacesContext.responseComplete. Silosacontecimientossehancoladuranteestafase,laimplementacinJavaServerFacesemisionesa oyentesinteresados. Silapeticinactualseidentificacomounapeticinparcial,elcontextoparcialserecuperadelascaras decontextoyelmtododetransformacinparcialesaplicado.Procesamientoparcialestcubiertoen JavaEE6Tutorial,VolumenII:Temasavanzados. 3.8.6
Fasedeinvocacindelaaplicacin
Duranteestafase,laimplementacinJavaServerFacesmanejacualquiersolicituddeeventosdenivel, talescomolapresentacindeunformularioounvnculoaotrapgina. Enestepunto,silasolicitudtienequereorientarlosrecursosadiferentesaplicacioneswebodegenerar unarespuestaquenocontienecomponentesJavaServerFaces,puedellamara FacesContext.responseComplete. Siseprocesaelpuntodevistafuereconstruidoapartirdeinformacindeestadodeunasolicitud anteriorysiuncomponentehadisparadounevento,estoseventossetransmitenalosoyentes interesados. Porltimo,lastransferenciasdeJavaServerFacesaplicacindecontrolparahacerquelafasede respuesta. 3.8.7
Fasedecreacindelarespuesta
Duranteestafase,JavaServerFacesconstruyeelpuntodevistaydelegalaautoridadparael renderizadodelaspginas.Porejemplo,paraelcontenedordeJSPsilaaplicacineslautilizacinde pginasJSP.
Versin1.0
CursodeJSP
Pagina25/70
Sisetratadeunasolicitudinicial,loscomponentesqueestnrepresentadosenlapginaseagregaal rboldecomponentes.Siestonoesunasolicitudinicial,loscomponentesseaadenyaalrbolparaque nosenecesitaaadirms. Silasolicitudesunadevolucindedatosyloserroresfueronencontradosdurantelafasedesolicitudde aplicarlosvalores,lasvalidacionesdeprocesodefase,ofasedeactualizacindelosvaloresdelmodelo, lapginaoriginalserepresentaenestafase.Silaspginascontienenmensajesolosmensajesdelas etiquetas,losmensajesdeerrorenlacolasemuestranenlapgina. Despusdequeelcontenidodelavistaserepresenta,elestadodelarespuestaseguardaparaquelas solicitudesposterioressepuedeaccederal.Elestadoguardadoseestadisposicindelafasede restauracindevista.
Versin1.0
CursodeJSP
Pagina26/70
4 ExpresionesEL
4.1 InformacingeneralsobreEL
Ellenguajedeexpresinunificadapermitealosautoresdepginasutilizarexpresionessencillaspara accederalosdatosdeformadinmicaapartirdecomponentesJavaBeans. LatecnologaJavaServerFacesutilizaELparalassiguientesfunciones: Evaluacindiferidaeinmediatadelasexpresiones Lacapacidaddeestablecer,ascomoobtenerdatos Lacapacidaddeinvocarlosmtodos Enresumen,ellenguajedeexpresinunificadaproporcionaunamaneradeutilizarexpresionessencillas parallevaracabolassiguientestareas: LeerdemaneradinmicalosdatosdeaplicacionesalmacenadosenJavaBeans,diversas estructurasdedatos,yobjetosimplcita Escribirdemaneradinmicalosdatos,talescomolaentradadelusuarioenlosformularios,alos componentesdeJavaBeans Invocacindemtodosarbitrariosestticaypblica Realizaroperacionesaritmticasdemaneradinmica
Evaluacininmediataydiferida 4.2
ELapoyalaevaluacin,tantoinmediatosydiferidosdelasexpresiones.Laevaluacininmediatase entiendequelaexpresinseevalayelresultadoesdevueltoinmediatamentecuandolapginase representaporprimeravez.Evaluacindiferidasignificaquelatecnologaqueutilizaellenguajede expresionespuedenemplearsupropiomecanismoparaevaluarlaexpresinenalgnmomentoms tarde,duranteelciclodevidadelapgina,ocuandoseaapropiadohacerlo. Esasexpresionesqueseevalandeinmediatoelusode${}sintaxis.Expresionescuyaevaluacinsehace demaneradiferidautilizarel#{}sintaxis. Debidoasuciclodevidadevariasfases,latecnologaJavaServerFacesusaprincipalmenteexpresiones deevaluacindiferida.Duranteelciclodevida,loseventosdecomponentessemanejan,losdatosson validados,yotrastareasqueserealizanenunordendeterminado.Porlotanto,unaaplicacin JavaServerFacesdebediferirlaevaluacindelasexpresiones,hastaelpuntoapropiadoenelciclode vida. 4.2.1
EvaluacinInmediata
Todaslasexpresionesutilizandolasintaxis${}seevalandeinmediato.Estasexpresionesslopueden serutilizadosdentrodeunaplantilladetextoocomoelvalordeunatributodeetiquetaquepuede aceptarlasexpresionesentiempodeejecucin. Elsiguienteejemplomuestraunaetiquetadereferenciacuyovaloratribuirunaexpresindeevaluacin inmediataqueobtieneelpreciototaldelasesinbeandenombredecart:

<fmt:formatNumber value="${sessionScope.cart.total}"/>
LaimplementacindeJavaServerFacesevalalaexpresin,${sessionScope.cart.total},loconviertey pasaelvalordevueltoalcontroladordeetiqueta.
CursodeJSP
Pagina27/70
Expresionesdeevaluacininmediatasonsiempredeslolecturaexpresionesdevalor.Laexpresin ejemploanteriorslosepuedeobtenerelpreciototaldecompradelgrano,nopuedeestablecerelprecio total. 4.2.2
Evaluacindiferida
Expresionesdeevaluacindiferidaadoptarlaforma#{expr}ypuedeserevaluadoenotrasfasesdeun ciclodevidadepginatalcomosedefineporloquelatecnologaeselusodelaexpresin.Enelcasode latecnologaJavaServerFaces,sucontroladorpuedeevaluarlaexpresinenlasdiferentesfasesdel ciclodevidaenfuncindecmolaexpresinseutilizaenlapgina. ElsiguienteejemplomuestraunaetiquetadeJavaServerFacesinputText,loquerepresentaun componentecampodetextoenelqueunusuariointroduceunvalor.LaetiquetainputText,referencias elvalordeunatributodeexpresindeevaluacindiferidaqueapuntaalapropiedadnamedelbean customer.

<h:inputText id="name" value="#{customer.name}" />
Paraqueunasolicitudinicialdelapginaquecontieneunaetiqueta,laimplementacinJavaServer Facesevalalaexpresin#{customer.name}durantelafasedeRebderresponsedelciclodevida.Durante estafase,laexpresinslotieneaccesoalvalordelnombredelcliente,comosehaceenlaevaluacin inmediata. Paraunasolicituddedevolucindedatos,laimplementacinJavaServerFacesevalalaexpresinen lasdiferentesfasesdelciclodevida,durantelacualelvalorserecuperadelasolicitud,validados,y reproducidasenelbeandelcliente. Comosemuestraenesteejemplo,lasexpresionesdeevaluacindiferidapuedenserexpresionesdevalor quesepuedeutilizarparaleeryescribirdatos.Tambinpuedenserexpresionesmtodo.Expresionesde valor(tantoinmediatoscomodiferidos)ylasexpresionesmtodoseexplicaenlasiguienteseccin.
4.3 Valoryelmtododeexpresiones
LaELsedefinendostiposdeexpresiones:expresionesdevaloryexpresionesmtodo.Expresionesde valorpuedeproducirunvaloroestablecerunvalor.Expresionesmtodosllamaametodosquepueden serinvocadoypuededevolverunvalor.
4.4 Operadores
Ademsdel.y[],ellenguajedeexpresinunificadoproporcionalossiguientesoperadores,quepueden serutilizadosenexpresionesrvalueslo: Aritmtica:+,(binario),*,/ydiv,%yelmod,(unario) Lgicos:AND,&&,o,||,not,! Relacionales:==,eq,!=,ne,<,lt,>,gt,<=,ge,>=,le.Sepuedenhacercomparacionesconotros valores,ocontraBoolean,String,enterooflotante. Vaco:Eloperadordevacoesunaoperacindeprefijoquepuedeusarseparadeterminarsiun valoresnuloovaco. Condicional:A?B:C.EvaluarBoC,dependiendodelresultadodelaevaluacindeA. Laprecedenciadelosoperadoresdemayoramenor,deizquierdaaderechaescomosigue: []. ()(Utilizadoparacambiarlaprioridaddelosoperadores) (Unario)not!empty
CursodeJSP
Pagina28/70
/divmod% +(Binario) <><=>=ltgtlege ==!=eqne &&and ||or ?:
4.5 Palabrasreservadas
Laspalabrassiguientesestnreservadasparaellenguajedeexpresinunificadaynodebeutilizarse comoidentificadores. and ne ge instanceof or lt true empty not gt false div eq le null mod
4.6 EjemplosdeusodeEL
Ejemplo #(myBean.value) Descripcin Devuelveelvalordelapropiedaddelobjetoalmacenadoenlaclavede myBean,oelelementoalmacenadoenelvalordelaclave,simyBeanesde tipoMap #(myBean['value']) Igualque"myBean.value(#)". #(myArrayList[5]) Devuelveelquintoelementodeunalistaquesealmacenaenlaclavede myArrayList. #(myMap['foo']) Devuelveelobjetoalmacenadoenlaclavefoodelmapaalmacenadoen myMap. #(myMap[foo.bar]) Devuelveelobjetoalmacenadoenlaclavequeesigualalvalordela expresinfoo.bardelmapaalmacenadoenmyMap. #(myMap['foo'].valor) Devuelveelvalordelapropiedaddelosobjetosalmacenadosenlaclavede foodemyMap. #(myMap['foo'].valor[5]) Devuelveelquintoelementodelalistaomatrizalmacenadaenlaclavede myMapclave. #()miCadena DevuelvelacadenadeobjetosalmacenadosenelmarcodelmiCadena clave. #()myInteger DevuelveelenteroobjetoalmacenadoenelmarcodelmyIntegerclave. #(user.role=='normal') Devuelvetruesielpapeldelapropiedaddelobjetoalmacenadoenlaclave deelusuarioesigualalanormalidad.Devuelvefalseencasocontrario. #((user.balance200) Sielvalordelapropiedaddeequilibriodelobjetoalmacenadoenelmarco delclavedeusuariomenos200igualacero,devuelvetrue.Devoluciones OTHfalsos Hola#()user.name! Devuelvelacadena"Hola",seguidadelnombredelapropiedaddelobjeto almacenadosenlaclavedeusuario.Asquesielnombredelusuarioes Sean,esto"retornoHolaSean!" Ests#((user.balance> Devuelvelacadena"Ustedestcargado"silapropiedaddeequilibriodela 100)?"cargado":"no objetoalmacenadoenlaclavedeusuarioesmayorde100;devuelve"Usted cargado') nosecargan"deotramanera. #()myBean.methodName Devuelveelmtodollamadomtododelobjetoalmacenadoenelmarcodel myBeanclave. #(20+3) Devuelve23.
CursodeJSP
Pagina29/70
5 JSTLLibrerasestndarTaglib
5.1 Introduccin
ExistenvariaslibrerasTaglibdisponibleparaJSPyJSF. FuntionalArea Core XMLprocessing I18Ncapableformatting Databaseaccess(SQL) Functions URI http://java.sun.com/jsp/jstl/core http://java.sun.com/jsp/jstl/xml http://java.sun.com/jsp/jstl/fmt http://java.sun.com/jsp/jstl/sql http://java.sun.com/jsp/jstl/functions Prefix c x fmt sql fn Example <c:tagname ...> <x:tagname ...> <fmt:tagname ...> <sql:tagname ...> fn:functionName(...)
5.2 Core
ELseutilizaenlabibliotecadeetiquetasCore.Laetiquetadelosproductos<c:out>evaluacindela expresinELparaelJspWriteractual.EstoessimilarenfuncionalidadaJSP<%=exp%>.La utilizacinsehaceas: <c:outvalue="${customer.name}"default="N/A"/> Tambinesposibleestableceryeliminarlasvariablesdembito.Elmbitodeaplicacin predeterminadoqueseutilizaeslapgina.Porejemplo,podemosdefinirunavariablellamadaalmbito deaplicacindelclientemedianteelusode<c:set var="customer" value=${customer}" />yluegousar <c:remove var="customer" /> paraquitarlodembito. ConlaJSTLahorapodemosusarunaetiquetaparaatraparjava.lang.Throwable,porejemplo,<c:catch var="myError" />.Elusodeestaetiquetapermiteelmanejouniformedeerrorquesedeclareenuna pgina.EstaetiquetanosepretendesustituirelactualmecanismodeerrordepginaJSP.Medianteel usodelaetiqueta <c:catch>esposibletenerbuencontroldeerroresdegrano,loquepermitequelos erroressemanejanporlapginaenlugardeiralapginadeerrornotodosloserroresquesetira realmentenecesitaparairalapginadeerror.Alutilizarel<c:catch>etiqueta,esposibledisearmejor lasinteraccionesdelusuario,porqueelflujodelapginaesmsfcildeusar.
5.3 Iteracin
Laetiquetadeiteracinbsicaes<forEach>,queiterasobrelamayoradelascoleccionesyobjetos similares,unopensaraquepararecorrereniteracin.<forTokens>lepermiteiterarsobrefichasenun objetoString,quelepermiteespecificarlacadenaylosdelimitadores. ProbablementelascaractersticasmstilesdelaJSTLsonlasaccionesdeiteracin.Lasaccionesque iteracionesdeapoyoson<c:forEach>,<c:forToken>,y<x:forEach>.TambinhayetiquetasXMLque imitanlasetiquetasbsicasparalasiteraciones.HablaremosdelaetiquetadeaccinXMLenun momento,peroporahora,vamosaseguirconlasaccionesfundamentales.
Versin1.0
CursodeJSP
Pagina30/70
EstasaccionesdeapoyoatodoslostiposestndarderecogidadeJ2SE,incluyendolalista,LinkedList, ArrayList,Vector,Stack,ySet.Estoincluyetambinlosobjetosjava.util.MapcomoHashMap, Hashtable,Properites,Providers,yAtributes.Tambinpuedeiterarsobreunconjuntodeobjetosode tiposprimitivos.Alutilizarlostiposprimitivos,elelementoactualqueestenvueltoconlaclase contenedoradeJava.Asqueelelementoactualdeunamatrizdeenterosqueserunentero.Dosobjetos seexportanparacadaiteracin,elelementoactualyelestadodelaiteracin.Veamoselsiguiente ejemplo:

<table> <c:forEach var="product" items="${products}" varStatus="status"> <tr> <td><c:out value="${status.count}"/></td> <td><c:out value="${product.name}"/></td> </tr> </c:forEach> </table>
Enesteejemplo,laColeccinsehaespecificadoporelELcomoproductos.Eltemaactualescontenidaen elproductovariable.ElestadoactualdelaiteracinsecelebraenelestadodelobjetovarStatus.Muy sencillo.
5.4 AccionesdeURL
Ademsdelasaccionesderepeticin,labibliotecatambinofreceaccionesrelacionadasconURL.Esto incluyeapoyoparaloshipervnculos,lasimportacionesderecursos,yredireccionamientos.Usodela etiqueta<c:url>manejalareescrituradeURLylacodificacinautomtica.Sinosfijamosenelejemplo deunaURLconunparmetroyluegousarlaenunenlace,puedesercomoeste:
<c:url=http://mysite.com/register var="myUrl"> <c:param name="name" value="${param.name}"/> </c:url> <a href='<c:out value="${myUrl}"/>'>Register</a>
ElusodelasimportacionesderecursostambinsehicieronmspoderososconelJSTL.Ahoraesposible especificarrutasabsolutas,relativas,enrelacinconladireccindeuncontextoexterior,ylosrecursos deFTP.Echemosunvistazoaunpardeejemplos: URLabsoluta:<c:importurl="http://sample.com/Welcome.html"/> RelativaURL(paraelcontextoactual):<c:importurl="/copyright.html"/> URLrelacionadaconuncontextoexterior:<c:importurl="/myLogo.html"context="/common"/> RecursosFTP:<c:importurl="ftp://ftp.sample.com/myFile"/>
Delosejemplosanteriores,esobvioque<c:import>proporcionamspotenciaqueconun<jsp:include>, sinembargo,tambinhayotrasrazonesparautilizarlasetiquetas.Haymejorasenelcontenidodelos recursosdebufferenlaJSTLqueeliminarelbufferinnecesarios.
5.5 Condicionales
JSTLescompatibleconunacondicionalsimple<if>etiquetajuntoconunacoleccindeetiquetas <choose>,<when>,y<otherwise>queelapoyodeloscondicionalesmutuamenteexcluyentes.Estos ltimostresetiquetaspermitenaplicaruntpicoif/elseif/elseifestructuray/olosdems. Utilizandoellenguajedeexpresinenlasaccionescondicionaltambinpuedeserunmecanismo poderosoparasimplificarelcdigoJSP.Alutilizarel<c:if>etiqueta,esposibleconstruirexpresiones
Versin1.0
CursodeJSP
Pagina31/70
condicionalessimples.Porejemplo,medianteelaccesoaunapropiedaddeobjetos,as:
<c:if test="${user.visitCount == 1}" Welcome back! </c:if>
Mutuamenteexclusivoscondicionalessontilescuandoseevalanslounodeunaseriedeacciones alternativasposibles.Esposiblellevaracabo"si/entonces/else"funcionalidadmediantelasetiquetas <c:choose>,<c:when>,y<c:otherwise>. Veamosunamuestra.Sifuramoselprocesamientoatravsdealgnconjuntoderesultados,podramos utilizarestasetiquetasparadeterminarculeselmensajecorrectoalapantalladebeser.

<c:choose> <c:when test="${count == 0}"> No records matched your selection. </c:when> <c:otherwise> <c:out value="${count}"/> records matched your selection. </c:otherwise> </c:choose>
5.6 FormatodetextoconcapacidadI18N
ElformatodedatosesunadelastareasclaveenmuchaspginasJSP.JSTLintroduceetiquetaspara apoyarelformatodedatosyanlisis.Estasetiquetassebasanenlamaquinariaconvenientepara soportaraplicacionesinternacionalizadas. OtraimportantereafuncionaldelaJSTLessuenfoqueinternacional(I18N)yelapoyodeformato.La utilizacindelasaccionesprevistasfacilitalainternacionalizacindeunasolicitudocontextobasede configuracin. EstasaccioneshacenusodelaResourceBundleJ2SEestndarseutilizaparamantenerlascadenasque estntraducidos.LasetiquetasJSTLutilizarelResourceBundleapropiado,dependiendodela configuracinregional.La<fmt:setLocale>etiquetapuedeserusadaparaespecificarunlugarcomoeste: <fmt:setLocalevalue="es_Es"/>,dondeelvaloresigualqueellenguajeyelcdigodepas.Tambines posiblespecificyunResourceBundle:<fmt:bundlebasename="ApplicationResource_fr"/>. Unavezquelaconfiguracinregionaloelpaqueteestestablecido,entonceslaetiqueta<fmt:message> usarautomticamenteelResourceBundlecorrecta.Paramtricodesustitucinsepuederealizarenlas cadenasdeestemodo:
<fmt:message key="welcome"> <fmt:param value="${visitCount}" /> <fmt:message/>
Tambinpuedeutilizar<fmt: solicitud.
requestEncoding />paraestablecerlacodificacindecaracteresdela
Cmoymostrarcadenasesslolamitaddeladiversininternacional.Tambindebehaberunamanera deanalizarelformatoylosnmerosylasfechas,lugaresdiferentessuelentenerformasespecficasde hacerlo.Usode<fmt:formatNumber> o <fmt:parseNumber> permiteelformatodelosnmeros,monedas,y losporcentajesdeacuerdoalalocalizacinactual.Lospatronestambinsepuedeespecificarconel atributodelpatrn.
Versin1.0
CursodeJSP
Pagina32/70
value="12.3" pattern=".00"/>seralasalida"12,30". <fmt:timeZone>, <fmt:setTimeZone>, y
Parademostrar:<fmt:formatNumber
Fechasyhorariossemanejanutilizandola<fmt:formatDate>,
<fmt:parseDate>.
5.7 Accesoabasesdedatos
LasbasesdedatosrelacionalesdefcilaccesomediantelasaccionesdeSQL.Ustedpuederealizar consultasdebasededatos,fcildeaccederalosresultados,realizaractualizaciones,yelgrupodevarias operacionesenunatransaccin. Medianteestasetiquetashaceposibleelestablecimientodefuentesdedatos,consultalafuentededatos, tienenfcilaccesoalosconjuntosderesultados,yrealizarlasactualizaciones,ascomolas transacciones.TodaslasetiquetasdeSQLactuanconunafuentededatos(datasource).Elorigende datospuederealizarseenvariasformas:sepuedeconfiguraratravsdelparmetrodeconfiguracin sql.datasource,puedeserunobjetoqueesproporcionadoporlalgicadelaaplicacin,opuedehaberun objetoproporcionadoporel<sql:setDataSource>accin.Porejemplo,siseutilizaunabasededatos MySQLconelcontroladorJDBC,puededefinirelorigendedatoscomo:
<sql:setDataSource var="datasource" driver="org.gjt.mm.mysql.driver" url="jdbc:mysql://localhost/db" />
ParaaquellosfamiliarizadosconelDriverManagerJDBC,<sql:setDataSource>esslounaenvoltura alrededordeesainstalacin.Sielatributodefuentededatosesunacadena,bienpodraserunaruta relativaaunrecursoJNDIounacadenadeparmetroJDBC. Unaconsultapuedeaccederalafuentededatos,as:<SQL:

de datos" ... /> fuente de datos de consulta = "$ () fuente
Siponemosunamuestradetodojuntoparaejecutarunaconsultaydespusmostrarelresultado,que podraparecersea:
<sql:query var="customer" datasource="${datasource}" SELECT * FROM customers WHERE state = 'CO' ORDER BY city </sql:query> <table> <c:forEach var="row" items="${customers.row}"> <tr> <td><c:out value="${row.custName}" /></td> <td><c:out value="${row.address}" /></td> </tr> </c:forEach> </table>
Realizarlasactualizacionesylastransaccionesestansimple.Porejemplo,podemosdefiniruna transaccinydespuscualquiernmerodecambiosarealizarenesatransaccin.Estosemuestraenel ejemplosiguiente.

<sql:transaction dataSource="${dataSource}"> <sql:update> UPDATE account SET Balance =Balance -? WHERE accountNo = ? <sql:param value="${transferAmount}"/> <sql:param value="${accountFrom}"/> </sql:update> </sql:transaction>
El<sql:dateParam> accinpuedeserusadoparafijarlosvaloresdelosmarcadoresdeparmetros(?)En unainstruccinSQL,paralosvaloresdejava.util.Date.Sibiennosemuestraenesteejemplo,es

CursodeJSP
Pagina33/70
posibleespecificarelniveldeaislamientodelatransaccin.Losnivelesdeaislamientodetransaccin sonlosdefinidospor java.sql.Connection.Sinoseespecificaningnniveldetransaccin,elnivelde aislamientodelafuentededatossehaconfiguradoconseutiliza.CualquierSQLExceptionquepodran ocurrireneltranscursodelaoperacinsedetectaysevuelveainiciarcomounJspTagExceptionporla etiqueta.
5.8 LamanipulacindeXML
LaltimaseriedeaccionesaconsiderareslasaccionesdeXML.LasaccionesdeXMLsepueden clasificarenbsico(core),controldeflujo,ytransformar.ElconjuntodeaccionesXMLenelJSTLse basaenXPath,queseutilizacomolenguajedeexpresinlocaldelasaccionesdeXML.Seleccioneel atributoseutilizaparaespecificarlaexpresinXPathparatodaslasaccionesdeXMLdeJSTL.Estaes unacadenaliteralqueseevalaelmotordeXPath. LasaccionesfundamentalesXMLsonsimilaresalasprevistasenlasaccionescore.Lasacciones incluyen<x:out>,<x:set>,y<x:parse>.LaprincipaldiferenciaentrelasetiquetasCoreylasetiquetas XMLesquelasetiquetasXMLapoyarlasexpresionesXPath,mientrasquelasetiquetasCoreno.La etiquetadeanalizarproporcionafuncionalidadparaanalizarundocumentoXMLenunaestructurade datos.EstaestructuradedatospuedenserprocesadosporelmotordeXPath.As,porejemplo,si tenemosunarchivoXMLqueidentificaaunlibro,sepuedeanalizar,yluegoaccederaesosdatos medianteunaexpresinXPatheimprimirlo:
<c:import url="http://oreilly.com/book?id=1234" var="xml"/> <x:parse source="${xml}" var="bookInfo"/> <x:out select="$bookInfo/title"/> <x:out select="$bookInfo/author"/>
Versin1.0
CursodeJSP
Pagina34/70
6 Formularios
6.1 Formulariosencillo
Paraponerenpracticaloanteriorvisto,vamosausarunformulariodeentradaalsitio. Lovamosaconstruirpocoapocoparallegaralcdigosiguiente: login.xhtml:
<h:head> <title>Entrada al sitio</title> <link rel="stylesheet" href="curso.css" /> <ui:include src="WEB-INF/include/head.xhtml"/> </h:head> <h:body> <ui:include src="WEB-INF/include/menu.xhtml"/> <h1><h:outputText value="Hello World!"/></h1> <h:graphicImage alt="GIF" url="/images/Duke_Blocks.gif" width="100px" /> <h:form> <h:panelGrid columns="3"> <h:outputText value="Usuario" /> <h:inputText id="username" value="#{Login.username}" required="true" validatorMessage="Minimo 2 caracteres!" requiredMessage="Value is required!" > <f:validateLength minimum="2" /> </h:inputText> <h:message for="username" styleClass="error"/> <h:outputText value="Clave" /> <h:inputText value="#{Login.password}" /> <h:commandButton value="Entrar" action="#{Login.submit}" actionListener="#{Login.onLogin}" /> </h:panelGrid> </h:form> </h:body>
curso.css:
root { display: block; } .logo{ font-size: 20px; color: teal; }
Login.java:
package curso; import javax.faces.bean.ManagedBean; import javax.faces.bean.RequestScoped; import javax.faces.event.AbortProcessingException; import javax.faces.event.ActionEvent; @ManagedBean(name = "Login") @RequestScoped public class Login { private String username; private String password; public void onLogin(ActionEvent e) { if (!username.equalsIgnoreCase("dukes") && !username.equalsIgnoreCase("admin")) { throw new AbortProcessingException("Usuario invalido"); } // password=null; } public String submit() { String outcome = "none"; if (username.equalsIgnoreCase("dukes")) { outcome = "success"; } else { outcome = "admin"; }
Versin1.0
CursodeJSP
System.out.println(outcome); return outcome;
Pagina35/70
} public void setPassword(String password) { this.password = password; } public void setUsername(String username) { this.username = username; } public String getPassword() { return password; } public String getUsername() { return username; } }
facesconfig.xml:
<?xml version='1.0' encoding='UTF-8'?> <faces-config version="2.0" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/webfacesconfig_2_0.xsd"> <navigation-rule> <from-view-id>/login.xhtml</from-view-id> <navigation-case> <from-outcome>admin</from-outcome> <to-view-id>/admin.xhtml </to-view-id> </navigation-case> <navigation-case> <from-outcome>success</from-outcome> <to-view-id>/index2.xhtml </to-view-id> </navigation-case> </navigation-rule> </faces-config>
Hayquecrearlaspginasindex2.xhtmlyadmin.xhtmltambien.
6.2 Formulariomascomplejo
Vamosacrearunformularioparaagregarunusuario,condiferentestiposdecamposenelformulario.
user_add.xhtml
<h:head> <title>Agregar un usuario</title> <link rel="stylesheet" href="curso.css" /> </h:head> <h:body> <h1>Agregar un usuario</h1> <h:form> <h:panelGrid columns="3" > <h:outputLabel value="Nombre:"/> <h:inputText id="nombre" value="#{Usuario.nombre}" size="20" maxlength="30" required="true" validatorMessage="Minimo 2 caracteres!" requiredMessage="El nombre no puede estar vacio" > <f:validateLength minimum="2" /> </h:inputText> <h:message for="nombre" styleClass="error"/>
Versin1.0
CursodeJSP
Pagina36/70
<h:outputLabel value="Apellido:"/> <h:inputText id="apellido" value="#{Usuario.apellido}" size="20" maxlength="30" required="true" validatorMessage="Minimo 2 caracteres!" requiredMessage="El apellido no puede estar vacio" > <f:validateLength minimum="2" /></h:inputText> <h:message for="apellido" styleClass="error"/> <h:panelGroup style="text-align:right;"><h:outputLabel value="Domicilio:"/></h:panelGroup> <h:inputTextarea id="add1" value="#{Usuario.add1}" cols="50" rows="3" ></h:inputTextarea> <f:verbatim /> <h:outputLabel value="Sexo:"/> <h:selectOneListbox title="Selecciona el sexo del usuario" value="#{Usuario.sexo}" size="1"> <f:selectItem itemValue="M" itemLabel="Masculino"/> <f:selectItem itemValue="F" itemLabel="Feminino"/> </h:selectOneListbox> <f:verbatim /> <h:outputLabel value="Cuantos herman@s"/> <h:inputText id="hermanos" value="#{Usuario.hermanos}" size="1" maxlength="2" required="true" validatorMessage="Valor aceptados: de 0 a 25." requiredMessage="Este campo no puede estar vacio" converterMessage="Se espera un numero entero aqui." > <f:validateLongRange minimum="0" maximum="25" /> </h:inputText> <h:message for="hermanos" styleClass="error"/> <h:outputLabel value="Salario"/> <h:inputText id="salario" value="#{Usuario.salario}" size="10" maxlength="12" required="true" validatorMessage="Valor aceptados: de 0 a 250000." requiredMessage="Este campo no puede estar vacio" converterMessage="Formato incorrecto." > <f:convertNumber maxFractionDigits="2" maxIntegerDigits="6" type="currency" currencySymbol="C$" locale="es" pattern=""/> <f:validateDoubleRange minimum="0" maximum="2500" /> </h:inputText> <h:message for="salario" styleClass="error"/> <h:panelGroup> <h:commandButton value="Agregar el usuario" action="#{Usuario.onSubmit}" ></h:commandButton> </h:panelGroup> </h:panelGrid> </h:form> </h:body>
Versin1.0
CursodeJSP
Pagina37/70
7 HtmlDataTable
UnDataTablemuestraunatablaHTML<table>. LascolumnasseespecificanconloscomponentessecundariosUIColumn. ElHtmlDataTabletienevariosparametros: ID:Seutilizaparaidentificarelcomponentedelatabla.Estedebesernicoenelcomponente mscercanodelospadres. Value:Representaelvalordelcomponente.Representaelvalorsobreelquelaiteracinsedebe hacer.Puedeserunamatrizocualquierobjetoiterador. Var:Esteeselnombredelavariablecreadaporlatabladedatosquerepresentaelelemento actualenelvalor.Esteatributopermiteexponerlosdatosenlasfilasdelatabla. Bgcolor:Esteatributoseutilizaparaestablecerelcolordefondodelatabla. Border:Sepuedeconfigurarelanchodelbordedelamesaalrededordelamesa. Cellpadding:Estoestableceelespacioentreelcontenidoylafronteradelaclula. Cellspacing:Seespecificalacantidaddeespacioparadejarentrelasclulas. First:Seutilizaparaespecificarelnmerodefiladelaprimerafiladelaquepresentamosesque seinicieenadelante.Supongamos,estapropiedadseestableceen3,quemuestraseiniciar desdelatercerafiladelosdatossubyacentes. Rows:Esteatributoespecificaelnmerodefilasamostrar.Viendoestesepondrenmarcha desdeelndiceespecificadoenla"primera"atributo.Siseestableceesteatributoacero,entonces todaslasfilasquesemostrarn. Width:Estoseutilizaparaestablecerelanchodetodalatabla.Suvalorseespecificaen%. Supongamosqueseestablecequeel50%,entoncesestatablasemuestraenelespaciodel50%de laanchuradelapantalla. Dir:Esteatributoindicaladireccindeltextoquesemostrarenlacelda.Senecesita"ltr"(de izquierdaaderecha)y"RTL"(dederechaaizquierda)valores.Sinoseespecificaesteatributoa continuacin,elcontenidosemostrarenelcentro. Frame:Esteatributoquespecifyesladosdelaestructuraentornoaestamesaservisible.Este atributopuedetomaralgunosvaloresquesemuestranacontinuacin: 1.noneNingunadelaspartes,Valorpredeterminado 2.topladosloporencimade 3.belowdeladoelfondoslo 4.hsidespartessuperioreinferiorslo 5.vsidesladosderechoeizquierdoslo 6.LHSladoizquierdoslo 7.RHSladoderechoslo 8.boxTodaslaspartescuadrodecuatro 9.borderTodaslaspartesfronteracuatro Rules:Esteatributoseutilizaparadibujarlneasentrelasclulas.Puedetomaralgunosvalores queseindicanacontinuacin: 1.none:Nohayreglasninguno,elvalorpordefecto 2.group:Entrelosgruposdelosgruposdefilas 3.rows:Entrelasfilasdelasfilasslo 4.cols:Entrecolumnasslo 5.all:Entretodaslastodaslasfilasycolumnas Summary:Puedeespecificarresumendelpropsitodelatabla. Rendered:Senecesitavalue.ThisbooleanIndicasiestecomponentedebeserprestado.Suvalor predeterminadoes"true".Siseestableceenfalseentoncesseimpidelaprestacindeeste componentealapgina.
Versin1.0 Reproduccinprohibida
CursodeJSP
Pagina38/70
CaptionClass:listaseparadaporespaciosdelaclaseoclasesCSSqueseaplicaracualquier ttulogeneradoparaestatabla. CaptionStyle:EspecificaestiloCSSoestilosquedebenaplicarsecuandoserepresentaeste epgrafe. ColumnClasses:listaseparadaporcomasdelasclasesCSSqueseaplicaralascolumnasde estecuadro. FooterClass:EsteatributotienelistaseparadaporespaciosdeestiloCSSdelaclaseoclasesque seaplicaraaheadertergeneradoparaestatabla. HeaderClass:EsteatributotienelistaseparadaporespaciosdelaclasedeestiloCSSoclases queseaplicarseacualquierencabezadogeneradoparaestatabla. RowClasses:EsunalistadeclasesCSSaplicadosalasfilasdelasclasestable.Thesedebenestar separadasporcomas.SiqueremosaplicarlaclasedeCSSparafilasindividuales,entonces podemosespecificarlistaseparadaporespaciosdeclasesCSS.Clasesdeestiloseaplicanalas filasenelmismoordenquesedefinidos.SitenemosdosclasesCSScontinuacindeprimera categoraseaplicaalaprimerafilaylasegundaseaplicaalasegunda.Entonces,denuevoenla tercerafila,elCSSseaplicaprimeroyassucesivamente.Esteprocesocontinahastalaltima filadelatabla. Lang:Estableceelidiomabasedelosatributosdeunelemento,esdecir,eltextoyellenguaje utilizadoenelmarcadogeneradoparaestecomponente. StyleClass:SeestableceelnombredelasclasesdeclassorCSSqueseaplicaenelmomentodela prestacindelelemento. Title:Elatributodelttuloseutilizaparaestablecereltextoparamostrarinformacinsobre herramientasparaelcomponent.Tooltipprestadosdescribeunelementocuandoserepresenta paraelcliente. Binding:Esunvalordelaexpresindeuninqueesutilizadoparaconectarcomponentesauna propiedadenunbeanderespaldo. OnClick:SeestableceelcdigoJavaScriptaejecutarcuandosehaceclicenlosbotonesdelratn sobreesteelemento. Ondblclick:SeestableceelcdigoJavaScriptqueseejecutacuandoelbotndelpunteroesdoble clicsobreesteelemento. Onkeydown:SeestableceelcdigoJavaScriptqueseejecutacuandosepresionaunateclahacia abajosobreesteelemento. Onkeypress:SeestableceelcdigoJavaScriptqueseejecutacuandosepulsaunateclay publicadosobreesteelemento. Onkeyup:SeestableceelcdigoJavaScriptqueseejecutacuandosesueltaunateclasobreeste elemento. Onmousedown:SeestableceelcdigoJavaScriptqueseejecutacuandoelbotnespulsadoel punterosobreesteelemento. Onmousemove:SeestableceelcdigoJavaScriptaejecutarcuandounbotonesdelratnse muevedentrodeesteelemento. Onmouseout:SeestableceelcdigoJavaScriptaejecutarcuandounbotonesdelratnsealejade esteelemento. Onmouseover:SeestableceelcdigoJavaScriptaejecutarcuandounbotonesdelratnsemueve sobreesteelemento. Onmouseup:SeestableceelcdigoJavaScriptaejecutarcuandounbotonesdelratnsesuelta sobreesteelemento.
Ejemplo: user_details.xhtml
<h:head> <title>Detalles del usuario</title> <link rel="stylesheet" href="curso.css" /> </h:head> <h:body>
Versin1.0
CursodeJSP
<h1>Detalles del usuario</h1> <h:dataTable value="#{Usuario}" var="user" border="1" cellspacing="2"> <h:column> <f:facet name="header"> <h:outputText value="First Name"/> </f:facet> <h:outputText value="#{user.nombre}"/> </h:column> <h:column> <f:facet name="header"> <h:outputText value="Last Name"/> </f:facet> <h:outputText value="#{user.apellido}"/> </h:column> <h:column> <f:facet name="header"> <h:outputText value="Balance"/> </f:facet> <h:outputText value="#{user.salario}"> <f:convertNumber type="currency"/> </h:outputText> </h:column> </h:dataTable> </h:body> Usuario.java: package curso.beans; import java.util.Calendar; import java.util.Date; import java.util.GregorianCalendar; import javax.faces.application.FacesMessage; import javax.faces.bean.ManagedBean; import javax.faces.bean.RequestScoped; import javax.faces.component.UIComponent; import javax.faces.context.FacesContext; @ManagedBean(name="Usuario") @RequestScoped public class Usuario { private String nombre; private String apellido; private String sexo; private Date fecnac=new Date(); private String add1; private String pasatiempo; private Byte hermanos; private Double salario=1550.25564; private Integer testInt=12900; public Usuario() { }
Pagina39/70
public Usuario(String nombre, String apellido, String sexo, Date fecnac, String add1, String pasatiempo, Byte hermanos, Double salario) { this.nombre = nombre; this.apellido = apellido; this.sexo = sexo; this.fecnac = fecnac; this.add1 = add1; this.pasatiempo = pasatiempo; this.hermanos = hermanos; this.salario = salario; } public String onSubmit(){ return "success"; } public void validateCCExpiry(FacesContext cntx, UIComponent cmp, Object val) { System.out.println("Validando la entrada "+val); String messS = null; String[] fields = ((String) val).split("/", 3); if (fields.length != 2) { messS = "Se espera MM/AA!"; } else { int month = 0; int year = 0; try {
Versin1.0
CursodeJSP
month = Integer.parseInt(fields[0]); year = Integer.parseInt(fields[1]); } catch (NumberFormatException e) { } if (month <= 0 || month > 12) { messS = "Mes " + fields[0] + " invalido!"; } else if (year < 0 || year > 99) { messS = "A&ntild:o " + fields[1] + " invalido!"; } else { GregorianCalendar cal = new GregorianCalendar(); int thisMonth = cal.get(Calendar.MONTH) + 1; int thisYear = cal.get(Calendar.YEAR) - 2000; if (year < thisYear || year == thisYear && month < thisMonth) { messS = "Tarjeta vencida!"; } }
Pagina40/70
} if (messS != null) { FacesMessage mess = new FacesMessage(messS); cntx.addMessage(cmp.getClientId(cntx), mess); } } public String getNombre() { return nombre; } public void setNombre(String nombre) { this.nombre = nombre; } public String getApellido() { return apellido; } public void setApellido(String apellido) { this.apellido = apellido; } public String getSexo() { return sexo; } public void setSexo(String sexo) { this.sexo = sexo; } public Date getFecnac() { return fecnac; } public void setFecnac(Date fecnac) { this.fecnac = fecnac; } public String getAdd1() { return add1; } public void setAdd1(String add1) { this.add1 = add1; } public String getPasatiempo() { return pasatiempo; } public void setPasatiempo(String pasatiempo) { this.pasatiempo = pasatiempo; } public void setSalario(Double salario) { this.salario = salario; } public void setHermanos(Byte hermanos) { this.hermanos = hermanos; } public Double getSalario() { return salario; } public Byte getHermanos() { return hermanos; } public void setTestInt(Integer testInt) { this.testInt = testInt; } public Integer getTestInt() { return testInt; }
Versin1.0
CursodeJSP
} demo_table.xhtml <h:head> <title>Lista de usuarios</title> <link rel="stylesheet" href="curso.css" /> </h:head> <h:body> <h1>Lista de usuarios</h1> <h:dataTable value="#{DemoTable.data}" var="user" border="1" cellspacing="2" columnClasses="col1,col2,col1,col2" rowClasses="row1,row2" headerClass="header"> <h:column> <f:facet name="header"> <h:outputText value="Nombre"/> </f:facet> <h:outputText value="#{user.nombre}"/> </h:column> <h:column> <f:facet name="header"> <h:outputText value="Apellido"/> </f:facet> <h:outputText value="#{user.apellido}"/> </h:column> <h:column> <f:facet name="header"> <h:outputText value="Sexo"/> </f:facet> <h:outputText value="#{user.sexo}"/> </h:column> <h:column> <f:facet name="header"> <h:outputText value="Salario"/> </f:facet> <h:outputText value="#{user.salario}"> <f:convertNumber type="currency"/> </h:outputText> </h:column> </h:dataTable> </h:body> DemoTable.java package curso.beans; import import import import import java.util.ArrayList; java.util.Date; java.util.List; javax.faces.bean.ApplicationScoped; javax.faces.bean.ManagedBean;
Pagina41/70
@ManagedBean(name="DemoTable") @ApplicationScoped public class DemoTable { List<Usuario> data = new ArrayList(); public DemoTable() { populateData(); } public List getData(){ return data; } public void setData(Usuario a){ data.add(a); } public void populateData(){ data.add(new Usuario("Cedric","Simon","M",new Date(),"Managua","demo",(byte)2,2500.80)); data.add(new Usuario("Juan","Palmado","M",new Date(),"Managua","demo",(byte)2,25.08)); data.add(new Usuario("Melanie","Castro","F",new Date(),"Managua","demo",(byte)2,1205.05)); data.add(new Usuario("Melanie2","Castro","F",new Date(),"Managua","demo",(byte)2,1205.05)); data.add(new Usuario("Melanie3","Castro","F",new Date(),"Managua","demo",(byte)2,1205.05)); data.add(new Usuario("Melanie4","Castro","F",new Date(),"Managua","demo",(byte)2,1205.05)); } }
Versin1.0
CursodeJSP
Pagina42/70
8 Mensajedeerrorpersonalizados
8.1 Listademensajepersonalizados
Enfacescontext.xml:
<application> <resource-bundle> <base-name>curso.ApplicationMessages</base-name> <var>ErrMsg</var> </resource-bundle> </application>
Ensrc/curso/creararchivoApplicationMessages.properties:
test=Hola Mundo
Uso:#{ErrMsg.test} HolaMundo
8.2 Pginadeerrorpersonalizada:
error.xhtml :
<h:head> <title>Pagina de error</title> </h:head> <h:body> <h2>Un error fata ocurio!</h2> <a href="#{request.getContextPath()}/faces/login.xhtml">Favor prueba de nuevo.</a> <p><h:link outcome="success" value="Favor prueba de nuevo."></h:link></p> <p><h:link outcome="index" value="Favor prueba de nuevo."></h:link></p> </h:body>
Configurarenweb.xml:
<error-page> <location>/error.xhtml</location> </error-page>
Versin1.0
CursodeJSP
Pagina43/70
9 Convertidores
9.1 Quesunconvertidor?
Unconvertidorseutilizaparadarformato"agradable"aunobjeto,textoquesemostrar. Porejemplo,sideseaparamostrarunafechaenJSPsepuedeutilizarunconvertidordeformatodela fechaaunformatomascomnparaelusuario,como"10/03/2005". Perohayotraformadeusarunconvertidor.Silosutilizaencombinacinconuncontroldeentrada, laentradadelusuariodebeestarenelformatoespecificadoporelconvertidor.Sielformatodela entradanocoincideenelformato,puedelanzarunaexcepcinenelconvertidorquesemuestraal usuario.Elobjetoasociadonoseactualizahastaquesecorrigeelerror.
9.2 Usodelosconvertidores
ElconvertidorepuedeserfijadodentrodeJSP,oustedpuederegistrarelconvertidormediante programacin. UstedpuederegistrarunconvertidorconJSPenunadelastresmaneras: Especifiqueelidentificadordeconvertidorconlapropiedadconverterdentrodelaetiqueta.
<h:outputText value="#{myBean.date}" converter="myConverter">
Juntar<f:converter>dedentrodelaetiquetadelcomponente.
<h:outputText value="#{myBean.date}"> <f:converter converterId="myConverter"/> </ h: outputText>
Juntarlaetiquetapersonalizadadelconvertidordentrodeunaetiquetadelcomponente.
<h:outputText value="#{myBean.date}"> <laliluna:myConverter /> </ h: outputText>
LossiguientesJSFEtiquetasapoyaconvertidores.
<h:outputText> <h:outputFormat> <h:outputLink> <h:outputLabel> <h:inputText> <h:inputTextarea> <h:inputHidden> <h:inputSecret> <h:selectBooleanCheckbox> <h:selectManyListbox> <h:selectMaynyMenu> <h:selectOneRadio> <h:selectOneListbox> <h:selectOneMenu>
9.3 Convertidoresincluidos
Sinoseespecificaunconvertidor,JSFescogerunoparausted.Elmarcohaconvertidoresestndar paratodoslostiposbsicos:Long,byte,integer,short,Character,Double,Float,BigDecimal, BigIntegeryBoolean.
Versin1.0
CursodeJSP
Pagina44/70
Porejemplo,sielcomponenteseasociaconunapropiedaddetipoboolean,JSFelijaelconvertidorde Boolean.Lostiposprimitivosseconviertenautomticamenteasushomlogosdeobjeto. Ademstieneconvertidorespredefinidosparafechasunmeros. 9.3.1
ConvertidorDateTime
ParatodoslostiposbsicosdeJavaJSFusarautomticamentelosconvertidores.Perosideseadar formatoaunafechaobjetodeJSFproporcionaunaetiquetaconvertidor<f:convertDateTime>. Estaetiquetadebeseranidadasdentrodeuntagcomponentequeapoyalosconvertidores.

<h:outputText value="#{myBean.date}"> <f:convertDateTime type="date" dateStyle="medium"/> </h:outputText>
ElconvertidorDateTimeadmiteatributos,comoeltipoodatestyle,paraconfigurarelconvertidor.El listaacontinuacinmuestralosatributosquepuedeutilizarconelconvertidordeDateTime. Nombredelatributo datestyle Descripcin Especificaelestilodeformatoparalaporcindela fechadelacadena.Lasopcionesvlidas sondeshort,medium(pordefecto),longyfull.Slo esvlidosiseestableceeltipodeatributo. Especificaelestilodeformatoparalaporcinde tiempodelacadena.Lasopcionesvlidas sondeshort,medium(pordefecto),longyfull.Slo esvlidosiseestableceeltipodeatributo. Especificalazonahorariaparalafecha.Sinose establece,horadelmeridianodeGreenwich(GMT) seutilizar. Elidiomalocalautilizarparalavisualizacinde estafecha.Reemplazalalocalizacinactual Elmodelodeformatodefechautilizadopara convertirestafecha.Utiliceesteoel tipodepropiedad. Especificasisedebemostrarlafecha(date),hora (time)oambas(both).
timeStyle
timezone
locale pattern
type
9.3.2
ConvertidordeNmero
Estesegundoconvertidorsepuedepersonalizarmedianteelusodeatributosadicionales,esel convertidordeNmero. Elestilparamostrarnmerosenlosformatosdebasequetrabajaparalaconfiguracinregionaldel usuario.

<h:outputText value="#{myBean.date}"> <f:convertNumber type="number" maxIntegerDigits="3"/> </ h: outputText>
Versin1.0
CursodeJSP
Pagina45/70
LalistaacontinuacinmuestraelatributoquesepuedeutilizarconelconvertidordeNmero.Estos atributospermitencontrolardemaneraprecisacmosemuestraunnmero. Nombredelatributo CurrencyCode Descripcin Especificaunperododetresdgitosdelcdigode monedainternacionalcuandoelatributotipoesla moneda.UtiliceesteoCurrencySymbol. Especificaunsmboloespecfico,como"$",quese utilizacuandoeltipodeatributoesmoneda. UtiliceesteoCurrencyCode. Truesiunsmbolodeagrupacin,como","o"" debeserutilizado.Elvalorpredeterminadoes true. Verdaderosislolaparteenteradelvalorde entradadebeserprocesado(todoslosdecimales serignorado).Elvalorpredeterminadoesfalso. Ellocalqueseutilizarparalavisualizacinde estenmero.Reemplazaelusuariolocalizacin actual Unacantidadmnimadedecimalesquesevea. Mximanmerodedecimalesquesevea. Unacantidadmnimadedgitosenterospara mostrar. Mximanmerodedgitosenterosparamostrar. Elmodelodeformatodecimalparaconvertireste nmero.Utiliceesteotipodeatributo. Eltipodenmero,porelnmero(number,por defecto),lamoneda(currency),oporciento (percent).Usaresteoelpatrndeesteatributo.
CurrencySymbol
groupingUsed
integerOnly
locale
minFractionDigits maxFractionDigits minIntegerDigits maxIntegerDigits pattern tipo
converters.xhtml: <h:head> <title>Convertidores JSF</title> </h:head> <h:body> <h4>Convertidores</h4> <p> Mostrar slo la fecha y la datestyle es <i> short </i> </p> <h:outputText value="#{Usuario.fecnac}"> <f:convertDateTime type="date" dateStyle="short" /> </h:outputText> <p> Mostrar slo el tiempo y el timeStyle es <i> full </i> </p> <h:outputText value="#{Usuario.fecnac}"> <f:convertDateTime type="time" timeStyle="full" /> </h:outputText> <p> Pantalla de fecha y hora, la datestyle es <i> full </i> y la configuracin regional es <i> ru </i> </p> <h:outputText value="#{Usuario.fecnac}"> <f:convertDateTime type="both" dateStyle="full" locale="ru" /> </h:outputText> <p> Mostrar tanto, la fecha y la hora y el datestyle es <i> short </i> </p>
Ejemplo:
Versin1.0
CursodeJSP
<h:outputText value="#{Usuario.fecnac}"> <f:convertDateTime type="both" dateStyle="short" /> </h:outputText> <p> Muestra una fecha con el patrn de <i> dd.mm.aaaa HH: mm </i> </p> <h:outputText value="#{Usuario.fecnac}"> HH:mm" pattern="dd.MM.yyyy <f:convertDateTime /> </h:outputText>
Pagina46/70
<h:form id="datetime1"> <p> entrada de una fecha y el datestyle es <i> short </i> </p> <h:inputText value="#{Usuario.fecnac}"> <f:convertDateTime type="date" dateStyle="short" /> </h:inputText> <h:commandButton value="Send" /> </h:form> <h:form id="datetime2"> <p> de entrada de una fecha que coincide con este patrn <i> dd.mm.aaaa </i> </p> <h:inputText value="#{Usuario.fecnac}"> <f:convertDateTime pattern="dd.MM.yyyy" /> </h:inputText> <h:commandButton value="Send" /> </h:form> <h4> convertidor Nmero </h4> <p> mxima de pantalla <i> 3 dgitos entero </i> </p> <h:outputText value="#{Usuario.testInt}"> <f:convertNumber maxIntegerDigits="3" /> </h:outputText> <p> Tipo de pantalla es <i> moneda </i> y la CurrencySymbol es <i> $ </i> </p> <h:outputText value="#{Usuario.testInt}"> <f:convertNumber type="currency" currencySymbol="$"/> </h:outputText> <p> Tipo de pantalla es <i> por ciento </i> </p> <h:outputText value="#{Usuario.testInt}"> <f:convertNumber type="percent"/> </h:outputText> Mostrar <p> mximo de 4 dgitos de fraccin </p> <h:outputText value="#{Usuario.salario}"> <f:convertNumber maxFractionDigits="4"/> </h:outputText> <p> Mostrar el nmero de patrones <i> # # # 0,00% </i> </p> <h:outputText value="#{Usuario.salario}"> <f:convertNumber pattern="###0.00%"/> </h:outputText> <h:form id="number1"> <p> entrada de un nmero, pero slo los dgitos entero ser procesado </p> <h:inputText value="#{Usuario.testInt}"> <f:convertNumber integerOnly="true"/> </h:inputText> <h:commandButton value="Send" /> </h:form> <h:form id="number2"> <p> entrada de un nmero coincida con el patrn <i> ##0,00 </i> </p> <h:inputText value="#{Usuario.testInt}"> <f:convertNumber pattern="##0,00"/> </h:inputText> <h:commandButton value="Send" /> </h:form> </h:body>
9.4 Convertidorespersonalizados
Aveces,losconvertidoresestndarnosonsuficientes.
Versin1.0
CursodeJSP
Pagina47/70
Porejemplo,ustedpuedenecesitarguardarenunabasededatoslosnmerosdetarjetadecrditosin guionesoespacios.Parausarconvertidorpersonalizado,ustednecesitaparacrearunaimplementacin delainterfazquejavax.faces.Converter,ysobreescibirsusmtodosgetAsObjectygetAsString. Debeimplementarlasdosdireccionesdelconvertidor.DurantealApplyRequestValues(fase2),el servletJSFutilizaelgetAsObjectmtodoparaconvertirlacadenadeentradaalmodelodeobjetosde datos.DuranteRenderResponse(fase9),elservletJSFutilizaelmtodogetAsStringparahacerla conversinenladireccinopuesta,demaneraqueunacadenapuedeserincluidoenlarespuestaHTML. Unavezfinalizadoelconversor,tienequeregistrarseconlaaplicacin.Sepuederegistrarenfaces config.xmlousandolanotacin@FacesConverter.

<converter> <converter-id>CCNumberConverter</converter-id> <converter-class>curso.converters.CCNumberConverter</converter-class> </converter>
Parainvocarelconvertidor,ustednecesitajuntarcomounapropiedaddef:convertidoroasignarala propiedadConverterdelcomponentedeentrada. Ejemplo: Vamosacrearunconvertidorquevaalimpiarunnmerodetarjetadecrditodecualquiercarcterno numrico.

package curso.converters; import javax.faces.convert.Converter; import javax.faces.context.FacesContext; import javax.faces.component.UIComponent; import javax.faces.convert.ConverterException; import javax.faces.convert.FacesConverter; @FacesConverter(value="CCNumberConverter") public class CCNumberConvertEr implements Converter { // getAsObject extracts from the input string all numeric characters public Object getAsObject(FacesContext ctx, UIComponent cmp, String val) { String convVal = null; if (val != null) { char[] chars = val.trim().toCharArray(); convVal = ""; for (int k = 0; k < chars.length; k++) { if (chars[k] >= '0' && chars[k] <= '9') { convVal += chars[k]; } } System.out.println("CCNumberConverter.getAsObject: '" + val + "' -> '" + convVal + "'"); } return convVal;
} // getAsString inserts into the object string spaces to make it readable // default: nnnn nnnn nnnn nnnn, Amex: nnnn nnnnnn nnnnn public String getAsString(FacesContext ctx, UIComponent cmp, Object val) throws ConverterException { String convVal = null; if (val != null) { int[] spaces = {3, 7, 11, 99}; int[] amex = {3, 9, 99}; String sVal = null; try { sVal = (String) val; // The val object should be a String! } catch (ClassCastException e) { throw new ConverterException("CCNumberConverter: Conversion Error"); } int kSpace = 0;
Versin1.0
CursodeJSP
char[] chars = sVal.toCharArray(); if (chars.length == 15) { spaces = amex; } convVal = ""; for (int k = 0; k < chars.length; k++) { convVal += chars[k]; if (spaces[kSpace] == k) { convVal += ' '; kSpace++; } } System.out.println("CCNumberConverter.getAsString: '" + sVal + "' -> '" + convVal + "'"); } return convVal; } converters_perso.xhtml: <h:head> <title>Convertidor Personalizado</title> </h:head> <h:body> <h4>Convertidor Personalizado </h4> <h:form id="number2"> <p> entrada de un nmero de tarjeta</p> <h:inputText value="#{Usuario.pasatiempo}" converter="CCNumberConverter"> </h:inputText> <h:commandButton value="Send" /> </h:form> </h:body>
Pagina48/70
Versin1.0
CursodeJSP
Pagina49/70
10Validadores
10.1UsoyCreacindelosvalidadores
Cmogarantizarqueelusuariodelaaplicacinnopuedecompraunnmeronegativodelibros?En realidad,laaplicacintambindeberechazarcualquierintentodecompradecerolibros.Yquhayde comprobarlavalidezdeunnmerodetarjetadecrdito?Estassontareasparalosvalidadores. JSFcuentaconcuatrotiposdemecanismosdevalidacin: Integradaenloscomponentes Validacinaniveldeaplicacin Componentesdevalidacinpersonalizada ValidacinpormtodosdeBackedBeans
10.2Validadoresincluidos
JSFproporcionalossiguientestrescomponentesdevalidacin: F:validateDoubleRange:Sevalidaqueunaentradanumricaestdentrodeunrangodeterminado.Es aplicablesalosvaloresquesepuedenconvertiraundoble. f:validateLength:Sevalidaquelalongituddelacadenadeentradaestdentrodeunrango determinado. F:validateLongRange:Sevalidaqueunaentradanumricaestdentrodeunrangodeterminado.Es aplicablesalosvaloresquesepuedenconvertiraunlong. Parautilizarestoscomponentesdevalidacin,simplementeanidardentrodelah:inputquenecesita validacin.Porejemplo,paracomprobarqueslocantidadespositivassepuedenintroducir:
<h:inputText id="quantity" value="#{item.quantity}" size="2" required="true" requiredMessage="Cuantos? Ninguno?" converterMessage="Un entero por favor!" validatorMessage="Minimo uno!"> <f:validateLongRange minimum="1"/> </h:inputText>
10.3Validacinaniveldeaplicacin
Lavalidacinaniveldeaplicacintienesentidosiesnecesarioparavalidarlalgicadeaplicacin,a diferenciadelavalidacindelacorreccinformaldeloscamposindividuales.Porejemplo,antesde aceptarunpedido,legustaracomprobarquesubanconotieneenlalistanegraelnmerodetarjetade crdito. Sideseahaceralgunasolicituddevalidacinaniveldeaplicacin,puedeinsertarsulgicaal principiodelmtodollamadaporelformularioyhacerquelaactualizacindebasesdedatosyel resultadomtododependedelresultadodevalidacin.Encasodeerrordevalidacin,tambinpodra enviarunmensajeparaelusuario,comosemuestraenlaspocaslneassiguientes:
FacesContext ctxt = FacesContext.getCurrentInstance(); FacesMessage mess = new FacesMessage(); mess.setSeverity(FacesMessage.SEVERITY_ERROR); mess.setSummary("Este es el mensaje de error principal"); mess.setDetail("Este es el detalle"); ctxt.addMessage(null, mess);
Versin1.0
CursodeJSP
Pagina50/70
Elmensajecreadodeestamaneraesunmensajeglobal,novinculadaaningncomponenteen particular,ysepuedevisualizarconelcomponenteJSFsiguiente:
<h:messages globalOnly="true" styleClass="error"/>
10.4Validadorespersonalizados
Enelcapitulosobrelosconvertidores,seexplicocmoimplementarunconvertidorpersonalizado.Para implementarunvalidadorpersonalizado,esunprocesocasiidntico: Crearunaaplicacindelainterfazquejavax.faces.validator.Validatoryreemplazaelmtodovalidar. Registrarelvalidadorenfacesconfig.xmlousalanotacinDocletenlaclase. DentrodelaaplicacindeJSF,consulteelatributovalidatordelcomponente. Supongamosquedeseaasegurarsedequeelcrdito,fechadecaducidaddetarjetaproporcionadaporel usuarioduranteelpedidoestenelformatomm/aoyquelatarjetanohacaducado.
package curso.validators; import javax.faces.validator.Validator; import javax.faces.context.FacesContext; import javax.faces.component.UIComponent; import javax.faces.application.FacesMessage; import javax.faces.validator.ValidatorException; import java.util.GregorianCalendar; import java.util.Calendar; import javax.faces.validator.FacesValidator; @FacesValidator("CCExpiryValidator") public class CCExpiryValidator implements Validator { public CCExpiryValidator() { } public void validate(FacesContext cntx, UIComponent cmp, Object val) { String messS = null; String[] fields = ((String) val).split("/", 3); if (fields.length != 2) { messS = "Se espera MM/AA!"; } else { int month = 0; int year = 0; try { month = Integer.parseInt(fields[0]); year = Integer.parseInt(fields[1]); } catch (NumberFormatException e) { } if (month <= 0 || month > 12) { messS = "Mes " + fields[0] + " invalido!"; } else if (year < 0 || year > 99) { messS = "A&ntild:o " + fields[1] + " invalido!"; } else { GregorianCalendar cal = new GregorianCalendar(); int thisMonth = cal.get(Calendar.MONTH) + 1; int thisYear = cal.get(Calendar.YEAR) - 2000; if (year < thisYear || year == thisYear && month < thisMonth) { messS = "Tarjeta vencida!"; } } } if (messS != null) { FacesMessage mess = new FacesMessage( FacesMessage.SEVERITY_ERROR, messS, messS); throw new ValidatorException(mess); } }
Pararegistrarelvalidador,esnecesarioagregarloafacesconfig.xmlousarlaanotacin@FacesValidator.
<validator> <validator-id>CCExpiryValidator</validator-id> <validator-class>curso.validators.CCExpiryValidator</validator-class> </validator>
Versin1.0
CursodeJSP
Pagina51/70
Uso:
<h:form> <h:inputText id="ccexpiry" value="#{Usuario.apellido}" rendered="true" requiredMessage="No puede estar vacio"> <f:validator validatorId="CCExpiryValidator" /> </h:inputText> <h:message for="ccexpiry" errorClass="error" /> <f:verbatim><br/></f:verbatim> <h:commandButton value="Probar"></h:commandButton>
</h:form>
10.5ValidadorenBackedBean
Enlugardecrearunanuevaclasecomosedescribeenlaseccinanterior,puedeagregarunmtodoaun backedbean. Enestecaso,puedeshacerlosiguiente: Copiarelmtododevalidacindentrodelaclase Copiadelasimportaciones SustituyalalneaquelanzalaValidatorExceptioncon:
if (messS != null) { FacesMessage mess = new FacesMessage(messS); cntx.addMessage(cmp.getClientId(cntx), mess); }
Ejemplo:
<h:inputText id="ccexpiry" value="#{Usuario.apellido}" rendered="true" requiredMessage="No puede estar vacio" validator="#{Usuario.validateCCExpiry}"> </h:inputText> <h:message for="ccexpiry" errorClass="error" />
Versin1.0
CursodeJSP
Pagina52/70
11Componentespersonalizados
11.1CreacindecomponentespersonalizadosparaJSP
Lafuncionalidaddeuncomponentesecentraenlaconversindelosometidoporunusuario(esdecir,los parmetrosHTTPdelapeticin)avaloresdeloscomponentes(atravsdelmtododedecodificacin duranteApplyRequestValues)ylaconversindevaloresdeloscomponentesdevueltaaHTML(a travsdelmtododecodificarduranteRenderResponse). CuandosediseauncomponenteJSF,sepuedeoptarporcambiarlacodificacinydecodificacindeuna claseseparadadeprocesamiento.Laventajadeesteenfoqueesquesepuededesarrollarmsdeun procesadorparaelmismocomponente,cadaunoconunarepresentacindiferenteenHTML.Usteda continuacin,tienenelmismocomportamientoasociadoscondiferentesmanerasdeleerlosdatosdela solicituddeylaescrituraalarespuesta. Engeneral,teniendoencuentaqueJSFesdecdigoabierto,podraconsiderarlamodificacindeun componenteexistenteenlugardedesarrollarunnuevo,oquizs,graciasalaseparacindelos componentesylosrenderer,lamodificacindeunrendererexistentes. LaclaserazdetodosloscomponentesJSFeslaclaseabstractajavax.faces.component.UIComponent,y delaclaserazdetodoslosrenderersesjavax.faces.render.Renderer.Paradesarrollaruncomponente, sinembargo,ustedprobablementevaapreferirampliaruncomponenteyaexistenteo,porloporlo menos,laclaseUIComponentBase,queproporcionaimplementacionespordefectodetodoslosabstractos losmtodosdeUIComponent.Deestaforma,ustedslotienequedesarrollarcdigoparalosmtodos quesenecesidaddereemplazar.Lomismoocurreconelprocesador. Paracompletarelpanoramadeloqueustednecesitahacerparatenersucomponentepersonalizado,es crearunaetiquetapersonalizadaparausarloconJSP.Laclaserazdetodaslasclasesdeetiqueta javax.faces.webapp.UIComponentELTag. Enresumen,paradesarrollaruncomponentepersonalizado,tienequeiratravsdelospasossiguientes, aunquenonecesariamenteenesteorden: CrearunaclasedecomponentesquelassubclasesUIComponentporlaampliacindeuna existentecomponente. Registrarelcomponenteenfacesconfig.xml. CrearunaclasedeprocesadorquesubclasaRendereryreemplazalosmtodosdecodificaciny descodificacin. Registrarelrenderirerenfacesconfig.xml. CrearunaetiquetapersonalizadaquesubclasaUIComponentELTag. CrearunTLDparalaetiquetapersonalizada. Unaltimapalabraacercadeloscomponentesylosrenderers:amenosqueustedrealmentepiensaque ustedvaalareutilizarelmismocomponenteparadiferentesaplicaciones,teharslavidamuchoms fcilsimantieneselrendererdentrodelcomponente. Enprimerlugar,vamosaverloquesedebehacercuandoestnseparados,yacontinuacinveremos cmomantenerlosjuntos. Lemostraremoscmodesarrollaruncomponentequecombinalafuncionalidaddelostrescomponentes estndarnecesariosparaaceptarlaentradadeunusuario:unaetiquetaqueexplicaloqueseespera,el
Versin1.0
CursodeJSP
Pagina53/70
campodetextoparaaceptarlaentrada,yunmensajeparainformardeerroresdeentrada.Enotras palabras,vamosamuestracmoreemplazarelcdigodeJSFsiguientes:
<h:outputText value="Nombre de Contacto"/> <h:inputText id = "nombre" required = "true" value = "# {Usuario.nombre}" requiredMessage = "El valor es necesario!" /> <h:message for="name" styleClass="error"/>
conestecomponentepersonalizado:
<curso:inputEntry label="Nombre de Contacto" required = "true" value = "#{Usuario.nombre}" errorStyleClass ="error" requiredMessage = "El valor es necesario!" />
TambinlemostraremoscmoestenuevocomponenteinputEntryimprimeunasteriscoalladode laetiquetasiesnecesario="true". 11.1.1
ElComponente
Elcomponenteesenrealidadlapartemsfcil.Vamosatravsdelosmtodosdeunoporuno. InputEntryComponenteslainicializacindeloscomponentes. Sunicatareaesregistrarconelcomponentedelacadenaqueidentificaelrenderer.Lanica propiedaddelcomponentesedefineenestearchivoeslaetiqueta(label).Estosedebeaqueesta ampliacinUIInput,queseencargadedefinirtodoloquetienequeverconelcampodeentrada. SeutilizaelmtodogetFamilyparaencontrartodoslosrenderersasociadosconestecomponente. Estamosplaneandocrearunsoloprocesador,perosiguesiendoapropiadaparadefinirunafamiliams bienqueheredandelafamiliadeUIInput,porquenosepodautilizarrenderizadoresUIInputcon InputEntryComponent. ElestadodelcomponenteconsisteenelestadodeUIInputmslapropiedaddelaetiqueta.Porlotanto, definirsuestadocomounarreglodedosobjetos.ElmetodoSaveStateformauna matrizylodevuelve,paraqueJSFpuedesalvarlo.ElmtodorestoreStaterecibeelEstado, lodescomprime,yloalmacenalocalmente.ObservecmolasoperacionesquetienenqueverconUIInput sonsiempredelegadas.
package curso.components; import javax.faces.component.FacesComponent; import javax.faces.component.UIInput; import javax.faces.context.FacesContext; @FacesComponent("curso.inputEntry") public class InputEntryComponent extends UIInput { private String label; public InputEntryComponent() { this.setRendererType("curso.inputEntry"); } public String getLabel() { return label; } public void setLabel(String label) {
Versin1.0
CursodeJSP
this.label = label; } // Overridden methods public String getFamily() { return "curso.inputEntry"; } public void restoreState(FacesContext ctxt, Object state) { Object val[] = (Object[]) state; super.restoreState(ctxt, val[0]); label = (String) val[1]; } public Object saveState(FacesContext ctxt) { Object val[] = new Object[2]; val[0] = super.saveState(ctxt); val[1] = label; return ((Object) val); } }
Pagina54/70
Ahoraquetieneelcomponente,ustedtienequeregistrarlo.Paraello,medianteelusodeunanotacin @FacesComponent olainsercindelasiguienteslneasenfacesconfig.xml:

<component> <component-type>curso.inputEntry</component-type> <component-class>curso.components.InputEntryComponent</component-class> </component>
11.1.2
Renderer
Elrendereresunpocomscomplicadoqueelcomponente.Paraimplementarlo,sedefineunaclaseque extiendejavax.faces.render.Renderer. Primerovamosasobreescribirtresmtodos,decode,encodeBegin,ygetConvertedValue. LanicapropiedadqueseagregaaUIInputeslaetiqueta,queelusuariopuedemodificar. Porlotanto,sloesnecesarioparadecodificarelcampodeentrada. ElprocesodedecodificacinocurreenlafasedeApplyRequestValues(fase2). Elprocesodecodificacinrequieremstrabajoqueelprocesodedecodificacin,porquetiene paraenviaralarespuestaHTTPlostrescomponentesquesecombinanparaformar InputEntryComponent.EstotienelugarduranteRenderResponse(fase9). Tenemosquecrearunmtodoparacodificarlaetiqueta.SeabreelelementoHTMLconlaetiqueta elmtododestartElement,escribelaetiquetaconunsimplemtododeescritura,escribeunasterisco, peroslosiserequiereelcomponente,ysecierraelelementodelaetiquetaconelmtodode endElement. Elresultadoesalgoascomo<label>Nombre
de contacto * </label>.
Creamosotromtodoparacodificarelcampodeentrada.SeabreelelementodeentradaHTML input,aadelosatributosconelmtodowriteAttribute,ycierraelelemento.Lostres parmetrosdewriteAttributesonelnombreyelvalordelatributoHTMLyelnombrede lapropiedaddelcomponente. Elresultadoesalgocomoelsiguienteelemento:

<input type="text" id="form:nameEntry" name="form:nameEntry" value="" />
Versin1.0
CursodeJSP
Pagina55/70
encodeMessageesunmtodoparacodificarelmensajedeerror.Seobtienelalistadetodoslosmensajes delacolaparaelcomponente,peroslomuestraelprimero.Siusteddeseamostraratodosellos,slo tienequesustituirlapalabraclaveifconunwhile. Paramostrarelmensaje,elmtodoabreelelementoSPANHTML,agregaelatributodeclasepara mostrarelmensajeconelestilocorrecto,muestraelmensaje,ysecierraelelemento.Elresultadoes algocomolosiguienteelemento:<span class="error">Un valor es necesario!</span>

package curso.renderers; import curso.components.InputEntryComponent; import java.io.IOException; import java.util.Iterator; import java.util.Map; import javax.el.ValueExpression; import javax.faces.application.FacesMessage; import javax.faces.component.UIComponent; import javax.faces.component.UIInput; import javax.faces.context.FacesContext; import javax.faces.context.ResponseWriter; import javax.faces.convert.Converter; import javax.faces.convert.ConverterException; import javax.faces.render.FacesRenderer; import javax.faces.render.Renderer; @FacesRenderer(rendererType="curso.inputEntry", componentFamily="curso.inputEntry") public class InputEntryRenderer extends Renderer { public void decode(FacesContext ctxt, UIComponent cmp) { InputEntryComponent ieCmp = (InputEntryComponent) cmp; Map requestMap = ctxt.getExternalContext().getRequestParameterMap(); String clientId = cmp.getClientId(ctxt); String val = (String) requestMap.get(clientId); ((UIInput) ieCmp).setSubmittedValue(val); } public void encodeBegin(FacesContext ctxt, UIComponent cmp) throws IOException { InputEntryComponent ieCmp = (InputEntryComponent) cmp; ResponseWriter respWr = ctxt.getResponseWriter(); encodeLabel(respWr, ieCmp); encodeInput(respWr, ieCmp); encodeMessage(ctxt, respWr, ieCmp); respWr.flush(); } public Object getConvertedValue(FacesContext ctxt, UIComponent cmp, Object subVal) throws ConverterException { Object convVal = null; ValueExpression valExpr = cmp.getValueExpression("value"); if (valExpr != null) { Class valType = valExpr.getType(ctxt.getELContext()); if (valType != null) { convVal = subVal; if (!valType.equals(Object.class) && !valType.equals(String.class)) { Converter converter = ((UIInput) cmp).getConverter(); converter = ctxt.getApplication().createConverter(valType); if (converter != null) { convVal = converter.getAsObject(ctxt, cmp, (String) subVal); } } } } return convVal; } private void encodeLabel(ResponseWriter respWr, InputEntryComponent cmp) throws IOException { respWr.startElement("label", cmp); respWr.write(cmp.getLabel()); if (cmp.isRequired()) { respWr.write("*"); }
Versin1.0
CursodeJSP
respWr.endElement("label"); } private void encodeInput(ResponseWriter respWr, InputEntryComponent cmp) throws IOException { FacesContext ctxt = FacesContext.getCurrentInstance(); respWr.startElement("input", cmp); respWr.writeAttribute("type", "text", "type"); respWr.writeAttribute("id", cmp.getClientId(ctxt), "id"); respWr.writeAttribute("name", cmp.getClientId(ctxt), "name"); if (cmp.getValue() != null) { respWr.writeAttribute("value", cmp.getValue().toString(), "value"); } respWr.endElement("input"); } private void encodeMessage(FacesContext ctxt, ResponseWriter respWr, InputEntryComponent cmp) throws IOException { Iterator it = ctxt.getMessages(cmp.getClientId(ctxt)); // Notice: an if instead of a while if (it.hasNext()) { FacesMessage mess = (FacesMessage) it.next(); if (!cmp.isValid()) { String errorStyleClass = (String) cmp.getAttributes().get("errorStyleClass"); respWr.startElement("span", cmp); respWr.writeAttribute("class", errorStyleClass, "class"); respWr.write(mess.getDetail()); respWr.endElement("span"); } } } }
Pagina56/70
Pararegistrarelrenderer,usaunaanotacin@FacesRendereroinsertalaslneassiguientesenfaces config.xml:
<render-kit> <renderer> <component-family>curso.inputEntry</component-family> <renderer-type>curso.inputEntry</renderer-type> <renderer-class>curso.renderers.InputEntryRenderer</renderer-class> </renderer> </render-kit>
11.1.3
Tag
Elcomponentepersonalizadosehizo,peroparausarloconJSPesnecesariodefinirlaetiqueta personalizadacorrespondiente.Secreaigualqueunaaccinpersonalizadaperoextendiendolaclase UIComponentELTagenestecaso. Sedefineunapropiedadparacadaatributoconelapoyodelaetiqueta,peronopara elatributoid.LaraznesqueUIComponentELTagyalodefine. Tengaencuentaqueslotienenmtodossetter,sinlosgetterscorrespondiente.Estoesporquenuncase necesitaelmtodosget.ElmtodoSetPropertiescopialosvaloresdeatributodelaetiquetaal componente,yelmtododeliberacinlimpialoqueyanoesnecesario.

package curso.tags; import javax.el.ValueExpression; import javax.faces.component.UIComponent; import javax.faces.webapp.UIComponentELTag; public class InputEntryTag extends UIComponentELTag { private ValueExpression errorStyleClass; private ValueExpression label; private ValueExpression required; private ValueExpression requiredMessage; private ValueExpression value;
Versin1.0
CursodeJSP
// Setters public void setErrorStyleClass(ValueExpression errorStyleClass) { this.errorStyleClass = errorStyleClass; } public void setLabel(ValueExpression label) { this.label = label; } public void setRequired(ValueExpression required) { this.required = required; } public void setRequiredMessage(ValueExpression requiredMessage) { this.requiredMessage = requiredMessage; } public void setValue(ValueExpression value) { this.value = value; } // Overridden methods public String getComponentType() { return "curso.inputEntry"; } public String getRendererType() { return "curso.inputEntry"; } protected void setProperties(UIComponent cmp) { super.setProperties(cmp); if (errorStyleClass != null) { cmp.setValueExpression("errorStyleClass", errorStyleClass); } if (label != null) { cmp.setValueExpression("label", label); } if (required != null) { cmp.setValueExpression("required", required); } if (requiredMessage != null) { cmp.setValueExpression("requiredMessage", requiredMessage); } if (value != null) { cmp.setValueExpression("value", value); } } public void release() { super.release(); errorStyleClass = null; label = null; requiredMessage = null; value = null; required = null; }
Pagina57/70
AntesdepoderutilizarlaetiquetapersonalizadaenJSPannecesidaddecrearunTLDaponerenla carpetaWEBINF/tlds/. curso.tld:
<?xml version="1.0" encoding="UTF-8"?> <taglib version="2.1" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/webjsptaglibrary_2_1.xsd"> <tlib-version>1.0</tlib-version> <short-name>curso</short-name> <uri>/WEB-INF/tlds/curso</uri> <tag> <display-name>inputEntry</display-name>
Versin1.0
CursodeJSP
<name>inputEntry</name> <tag-class>curso.tags.InputEntryTag</tag-class> <attribute> <name>id</name> <required>false</required> <rtexprvalue>true</rtexprvalue> </attribute> <attribute> <name>value</name> <required>false</required> <deferred-value><type>java.lang.Object</type></deferred-value> </attribute> <attribute> <name>required</name> <required>false</required> <deferred-value><type>boolean</type></deferred-value> </attribute> <attribute> <name>label</name> <required>false</required> <deferred-value><type>java.lang.String</type></deferred-value> </attribute> <attribute> <name>errorStyleClass</name> <required>false</required> <deferred-value><type>java.lang.String</type></deferred-value> </attribute> <attribute> <name>requiredMessage</name> <required>false</required> <deferred-value><type>java.lang.String</type></deferred-value> </attribute> </tag> </taglib>
Pagina58/70
Conesto,ustedestarpreparadoparautilizarelnuevohJSFcomponentedeinterfazdeusuario: inputEntry.Sloesnecesarioagregarlasiguientedeclaracindeespaciodenombrescursoalajsp: elementorazeneliniciodeeldocumentoJSP:<%@taglib prefix="curso" uri="WEB-INF/tlds/curso.tld"%> Ladesventajadelnuevocomponenteencomparacincontenerdemaneraindependienteloslabel,input, ymessage,esquenoesposiblealinearloscamposdeentradavertical. Ahoraqueyaesthecho,ustedpuedepreguntar,"Porqucurso:inputEntrysloadmitenunatributo, mientrasqueh:inputTexttienecomo40?"Esoesunbuenpunto.Podramoshaberaadido msatributos,talescomoeltamaodelcampodeentrada,queh:inputTextpasaaHTML,peronuestro objetivoerasercapazdereemplazarconuncomponentenicodelostresloscamposenqueseutilicen. Msatributosdeloestrictamentenecesarioslogeneraramscdigosinaadirnadatil. 11.1.4
InlineRenderer
Esposibleincluirlafuncionalidadderendererdentrodelaclasedecomponentes,demodoqueel componenteserepresenta(render)porsmismo.Comohemosmencionadoantes,amenosqueusted planeautilizarmsdeunprocesadorconelmismocomponente,esposiblequenosevaamolestar creandorentderersseparados. Parahacercurso:inputEntryconautorepresentacin,tienequehacerlosiguiente: 1.MuevalosmtodosdeInputEntryRenderer.javaaInputEntryComponent.java.Usted necesidadhaceralgunoscambioscosmticosquevamosaexplicarenunmomento.Despuessepuede borrarelarchivoderenderer. 2.AgregueelmtodoencodeEndaInputEntryComponent.java. 3.ReturnnullenelmtododegetRendererTypedeInputEntryTag.java. 4.Eliminarelregistrodelprocesadordefacesconfig.xml.
Versin1.0
CursodeJSP
Pagina59/70
LaclaseUIInput,queseextiendeparacrearelcomponente,hospedalostresmtodosdecode, encodeBegin,ygetConvertedValuequeutilizenelrendererporseparado,perosinelparmetro UIComponent.Tienemuchosentido,porqueelobjetocomponenteesdirectamenteaccesiblesconla palabraclavethis. Cuandosequitaelparmetrodecmpdelostresmtodos,tambindebereliminarestalneade decodificaryencodeBegin,porquesehaconvertidoenintil:

InputEntryComponent ieCmp = (InputEntryComponent)cmp;
Luego,remplazatodosloscmpyieCmpconthis. SenecesitaelmtodoencodeEndparareemplazarelmtodoenUIComponentBase,quearrojaun NullPointerException.Dehecho,ustednonecesitahacernadaenencodeEnd,solamentetienesque escribirunmtododevaco:public void encodeEnd(FacesContext context) throws IOException { } Tengaencuentaqueslonecesitaestemtodocuandoseejecutauncomponenteensmismo,nocuando seutilizaunaclasedeprocesadorseparado. EnInputEntryTag.java,elmtododevuelvegetRendererType"curso.inputEntry".Sielmtodoconsiste enutilizarsusmtodosderepresentacininterna,getRendererTypetienequevolvernull.Porltimo, eliminarlaslneasdelelementoderenderkitdefacesconfig.xmlsiestnpresente.
11.2ComponentespersonalizadosparaFacelets
ConlosFaceletsesmassencillalacreacindecomponentespersonalizados. NohaynecesidaddecrearunaclaseJava,solonecesitamosarchivosXHTML(yXML). HayquecrearunequivalentealTLDparafacelets(.xml),ydeclararloenweb.xml Ejemplodeinclusinenweb.xml:
<context-param> <param-name>facelets.LIBRARIES</param-name> <param-value>/WEB-INF/facelets/curso.xml</param-value> </context-param>
Ejemplodedescriptorcurso.xml:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE facelet-taglib PUBLIC "-//Sun Microsystems, Inc.//DTD Facelet Taglib 1.0//EN" "http://java.sun.com/dtd/facelet-taglib_1_0.dtd"> <facelet-taglib> <namespace>http://localhost</namespace> <tag> <tag-name>pie</tag-name> <source>../include/footer.xhtml</source> </tag> </facelet-taglib>
Paginafooter.xhtml:
<?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets"> <h:body> <ui:component> <h:panelGroup styleClass="footer"> <h:outputText value="Docente: Cedric Simon - "/>
Versin1.0
CursodeJSP
<h:outputLink value="mailto:cedric@solucionjava.com">cedric@solucionjava.com</h:outputLink> </h:panelGroup>. </ui:component> </h:body> </html>
Pagina60/70
LapginaaincluiresunapginaJSFXHTML,yelcomponentequequeremosincluirseencuentra entre<ui:component>y</ui:component>. Losparametrosserecuperancon#{nombreDelParametro}.Seacceptancomoparametrostambien objetosJSFometodos. Ejemplomascomplejo,equivalenteaInputEntry: input_entry.xhtml:

<?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:c="http://java.sun.com/jsp/jstl/core"> <h:body> <ui:component> <h:outputText value="Nombre de Contacto"/> <c:if test="#{required}">*</c:if>: <h:inputText id = "nombre" required = "#{required}" value = "#{value}" requiredMessage = "El valor es necesario!" /> <h:message for="nombre" styleClass="error"/> </ui:component> </h:body> </html>
custom_component.xhtml:
<h:form> <curso:inputEntry label="Nombre de Contacto" required = "true" value = "#{Usuario.nombre}" errorStyleClass ="error" requiredMessage = "El valor es necesario!" /> <f:verbatim><br/></f:verbatim> <h:commandButton value="Probar" type="submit"></h:commandButton> </h:form>
box_doble.xhtml:
<h:panelGrid border="1" columns="2"> <ui:insert name="izquierdo"/> <ui:insert name="derecho"/> </h:panelGrid>
Usodebox_doble:
<curso:box_doble> <ui:define name="derecho">Derecho</ui:define> <ui:define name="izquierdo">Izquierdo</ui:define> </curso:box_doble>
Versin1.0
CursodeJSP
Pagina61/70
12Introduccin a Ajax
12.1Definicinyuso
Ajax significa Asynchronous Javascript and XML. Basicamente, la tecnologa Ajax permite comunicar con sistemas remotos y/o refrescar partes de una pgina si necesidad de recargar la pgina. Algunos ejemplos del uso de Ajax: Lista con seleccin automtica de valor. Aplicaciones de chat 'Drag and drop' Validaciones extensas de formulario Mens dinmicos Personalizacin de pgina ...
12.2Marcosdetrabajo
ExistenmuchosmarcosdetrabajoparaAjax.LamayorasonmarcosdetrabajoparaJavascript,que tienenunaparteorientadaaAjax. Losmarcosdetrabajotepermitenusarcdigos/efectosconJavascript/Ajaxsinnecesidaddeentender todoelcdigoquevaatrs. Muyprobablementeestarsinteresadoenvariosmarcosdetrabajo,ytrabajarasconvariosalmismo tiempo,yaqueposiblementeningunotienetodoloquequieres. Ademas,elobjetivodeestecursoesqueseascapazdedesarrollartupropiomarcodetrabajoademasde usarlosterceros. Algunosmarcosdetrabajo'libres': Rico(http://openrico.org/) Script.aculo.us(http://script.aculo.us/) Mootools(http://demos.mootools.net/) OAT(http://oat.openlinksw.com/) ZeroKonfig(http://www.zkoss.org/) ...
Versin1.0
CursodeJSP
Pagina62/70
13AjaxconJava
13.1LlamadaAjaxconHTML
Coneljavascript'corriente',podemosmodificarlaformayelcontenidodeunapgina,perosin comunicarconfuentesexternas. Ajaxpermitecomunicarseconfuentesexternas,yaseaarchivosdetexto,pginasHTML,PHP,JSP, servlet,ocualquiertypodearchivoremoto. Parallamaraunapginaremotasinrefrescarlapginacorriente,hayquecrearunaconsultausando unafuncin,queesdiferentesiusasInternetExplorer(new ActiveXObject("Microsoft.XMLHTTP"))uotro navegadorcomoFirefox(new XMLHttpRequest( )). Unavezlaconsultalista,seusaelmetodo'open'delaconsultacon3parmetros:elmodode transmisin(generalmentegetopost)yelURLdelobjetoallamar.Opcionalsepuedemencionarsila llamadaesasncrona(pordefectoloes),yunusuarioyunaclaveparalacuenta. ApesardequeAjaxsignificaAsyncronousJavascriptandXML,esposiblehacerllamadassincrnicay usandotextoenvezdeXML. Unavezlallamadainiciada,seesperalarespuestausando'onreadystatechange'. Elestado'readyStatus'delallamadapuedetenerlosvaloressiguientes: 0Noiniciado 1Cargando 2Cargado 3Interactivo 4Completo Elestado'status'delallamadapuedetenerlosvaloressiguientes:
200 201 204 205 206 400 401 403 404 405 406 407 OK Created No Content Reset Content Partial Content Bad Request Unauthorized Forbidden Not Found Method Not Allowed Not Acceptable Proxy Authentication Required 408 411 413 414 415 500 501 502 503 504 505
Request Timeout Length Required Requested Entity Too Large Requested URL Too Long Unsupported Media Type Internal Server Error Not Implemented Bad Gateway Service Unavailable Gateway Timeout HTTP Version Not Supported
Generalmente,nosinteresaejecutarnuestrocdigocuandolaconsultaestcompletayconestadoOK. EjemplodellamadaAjax: ajax_html.jsp:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta name="description" content="Curso de Ajax - SolucionJava.com"> <meta name="keywords" content="Curso,Ajax,SolucionJava, java"> <link rel="stylesheet" type="text/css" href="css/estilo.css"> <SCRIPT language="JavaScript" src="js/soljava.js"></SCRIPT> <SCRIPT language="JavaScript" src="js/ajax_html.js"></SCRIPT> <title>www.solucionjava.com | Curso de Ajax | Primera llamada Ajax con HTML</title>
Versin1.0
CursodeJSP
</head> <body> <button onclick="getText();">Clic aqui</button> <div id="texto"> Este es mi bloque de texto inicial </div> </body> </html> ajax_html.js: var req; function getText() { var url = "nuevo_texto.txt"; if (window.XMLHttpRequest) { req = new XMLHttpRequest( ); } else if (window.ActiveXObject) { req = new ActiveXObject("Microsoft.XMLHTTP"); } req.open("Get",url,true); req.onreadystatechange = callback; req.send(null); } function callback( ) { if (req.readyState==4) { if (req.status == 200) { document.getElementById('texto').innerHTML = req.responseText; } } }
Pagina63/70
nuevo_texto.txt:
<h2>Este es el texto desde el archivo en el servidor!</h2>
13.2LlamadaAjaxconJava
Ahorahemosllamadounapginadetexto'fijo'enelservidor.MuyfcilmentesepodrasacarelURL,o lalistadeURLdelabasededatos,porejemplo.PeroelAjaxpermitemstodava:permitellamaraun Servletopginajsp,ytraerelcontenidodelservlet. 13.2.1
ServletparaAjax
Esunservletquevaadevolveruncontenidoestructuradoono.Puedesertexto,HTML,oXMLpor ejemplo. Enelejemploabajo,vamosarecuperarunnumeroalhazarsinsalirdelapgina. Ejemplo: ajax_java.jsp

<%@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> <title>www.solucionjava.com | Curso de Ajax | Primera llamada Ajax con Java</title> <script type="text/javascript" src="js/ajax_java.js"></script> <script type="text/javascript" src="js/soljava.js"></script> </head> <body onload="focusIn( );"> <table align="right"> <tr><td> <h4>Numero al hazar</h4> <div id="empList" style="background-color: white; font-size: 11px;color:blue;"> </div> </td></tr> </table> <h1>Primera llamada con AJAX </h1>
Versin1.0
CursodeJSP
Pagina64/70
<h2> Solo pone el numero que se va a multiplicar por el numero al hazar</h2> <table align="left"> <tr> <td>Numero de paciente : <input type="text" id="no" name="no" size="5" onchange="if (check_only_digitsNoDot(this)) {buscaPaciente(this);}"> </td> </tr> </table> </body> </html>
ajax_java.js
var req; function buscaPaciente(campo ) { var url = "GetRandomNumber?no=" + escape(campo.value); if (window.XMLHttpRequest) { req = new XMLHttpRequest( ); } else if (window.ActiveXObject) { req = new ActiveXObject("Microsoft.XMLHTTP"); } req.open("Get",url,true); req.onreadystatechange = callback; req.send(null); } function callback( ) { if (req.readyState==4) { if (req.status == 200) { document.getElementById('empList').innerHTML = req.responseText; } } } function focusIn( ) { document.getElementById("no").focus( ); }
GetRandomNumber.java:
package curso.servlet; import import import import import import java.io.IOException; java.io.PrintWriter; javax.servlet.ServletException; javax.servlet.http.HttpServlet; javax.servlet.http.HttpServletRequest; javax.servlet.http.HttpServletResponse;
public class GetRandomNumber extends HttpServlet { protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { String no=request.getParameter("no"); double rand = Math.random(); String ajaxData ="El numero al hazar es "+rand+", multiplicado por "+no+" = "+ (rand*Integer.parseInt(no)); this.writeResponse(response, ajaxData); } finally { out.close(); } } public void writeResponse(HttpServletResponse resp, String output) throws IOException { resp.setContentType("text/plain"); resp.setHeader("Cache-Control", "no-cache"); resp.setHeader("Content", "text/html;charset=iso-8859-1"); resp.getWriter().write(output); }
web.xml:
Versin1.0
CursodeJSP
... <servlet> <servlet-name>GetRandomNumber</servlet-name> <servlet-class>curso.servlet.GetRandomNumber</servlet-class> </servlet> <servlet-mapping> <servlet-name>GetRandomNumber</servlet-name> <url-pattern>/GetRandomNumber</url-pattern> </servlet-mapping>
Pagina65/70
13.3Ajaxyseguridad
ComoelAjaxpermite(enciertoscasos)hacerllamadasdirectasalabasededatosoarecursos'seguros', debentenerenmenteelaspectorelacionadoalaseguridadconAjax. ComolasllamadasAjaxsehacendesdeelnavegador,porunaconsultaHTML,esposiblerecuperarla sesindelusuarioyentoncesvalidarsieltieneaccesoaesterecurso(ono).
Versin1.0
CursodeJSP
Pagina66/70
14ComponentesJSFparaAjax
14.1CmoJSFyAjaxpuedentrabajarjuntos?
Utilizarel(Ajax)JavaScriptensupginaJSF PonersucdigodeAjaxJavaScriptenloscomponentesJSF AprovecharlacrecientecoleccindemarcosdetrabajoAjaxJSF Utilizarelnuevotag<f:ajax>
14.2Utilizarel(Ajax)JavaScriptensupginaJSF
Elmsprctico/formafcildeinyectaralgodefuncionalidadWeb2.0ensuinterfazdeusuarioJSF, PuedesagregartuspropiosJS,oextenderlosmarcosdetrabajoAjaxexistentescomo: Dojo JQuery Prototype Scriptaculous OAT 14.2.1 14.2.2
Pros
Tcnicamentesencillo Fcilparacosassimples/pequeas
Contras
TrabajoconJavaScriptmsavanzadopuedeserunretoparalosprogramadoresJava(usted tienequepasarcdigo(javascript)alladodelcliente). Puedeserdifcildepurarlaaplicacin(busqueerrorestantoenelservidoryelcliente)
14.3PonersucdigodeAjaxJavaScriptenlos componentesJSF
MedianteelusodelatecnologaJSFdecomponentesesposibleescribirsuspropioscomponentesque generanelJavaScriptnecesarioenelcliente. EstoesfactibleporqueJSFpuedegenerarcualquiertipodetextoenelcliente
/ / Javascript Render personalizado para llamar a JSSlider.js writer.Write ( "<script language=\"JavaScript\" src=\"" contextPath + + "/js/JSSlider.js\"> </ script>");
14.3.1 14.3.2
Pros
Arquitecturaslida Usuariofinal/desarrolladordeaplicacioneslopuedeutilizarfcilmentesintratarconJS.
Contras
Puedeserunretoparaconstruirdesdeunpuntodevistatcnico(tienesqueserun/experto clienteAjax,ascomounServerside/expertoenJSF)
Versin1.0 Reproduccinprohibida
CursodeJSP
Pagina67/70
Difcilesdedepurareneldesarrollodecomponentes
14.4Aprovecharlacrecientecoleccindemarcosde trabajoAjaxJSF
AhorapuedendescargardiversasbibliotecasdecomponentesJSF Instalacinfcilyrpida SoporteIDEtambinestdisponibleparamuchos(Eclipse,NetBeans,Exadel,JDeveloper...) Algunosejemplos:JBossRichFaces(Ajax4JSF),ICEfaces,ADFFaces(Trinidad)RichClient 14.4.1 14.4.2
Pros
Aprendizajemsfcil NotienesquelidiarconlascomplejidadesdelJavaScript Puedenelegirentreunacrecientecoleccindelasbibliotecas
Contras
Sitodofunciona,excelente! Todavapuedeserdifcildedepurarenelcliente(estoesporqueelcdigodeclientese representadesdeelcliente,yustedtienepocooningncontrolsobreeste)
14.5Utilizarelnuevotag<f:ajax>
JSF2.0traeunanuevalibreraparaAjax. 14.5.1 14.5.2
Pros
IncluidaenJSF2.0 NotienesquelidiarconlascomplejidadesdelJavaScript
Contras
Existenlimitacionesalusodeh:outputTextconAjax Tecnologamuynueva(>menosfuentesparaaprendizajeautodidacto,depuracin),soloJSF2.0 Todavapuedeserdifcildedepurarenelcliente(estoesporqueelcdigodeclientese representadesdeelcliente,yustedtienepocooningncontrolsobreeste)
14.5.3
PorquelAjaxenJSF?
PorquunabibliotecadeJSFAjaxespecfico? HaytoneladasdelasbibliotecasAjaxya(jQuery,DWR,GWT,etc.)Porquinventarunanuevapara JSF? 14.5.3.1 VentajasdeunenfoqueespecficoJSFAjax JSFespecfico Delladodelcliente: UstedpuedeactualizarloselementosJSF(h:outputText,h:inputText,h:selectOneMenu,etc). UstednotienequeescribirJavaScript Delladodelservidor LosbackedbeansestndisponibleenlasllamadasAjax Ustednotienequeescribirservletsyanalizarparmetros
Versin1.0
CursodeJSP
Pagina68/70
14.5.4
Usodeltag<f:ajax>
Descripcingeneral:
<h:commandButton action=""> <f:ajax render="id1 id2" execute="id3 id4" event="blah" onevent="javaScriptHandler"/> </h:commandButton>
Render:especificarloselementosaactualizarenelcliente Execute:especificarelementosparaprocesarenelservidor Event:especificarloseventosdeusuarioqueinicianlallamadaAjax onEvent:especificarlosscriptssecundarios(JavaScript)ainiciarlallamadaAjax Backedbeanutilizadoenlosejemplosabajo:

package curso.beans; import javax.faces.bean.ManagedBean; import javax.faces.bean.SessionScoped; @ManagedBean(name = "AjaxDemo") @SessionScoped public class AjaxDemo { private Integer a = 0; private int b=0; private String respuesta; public AjaxDemo() { } public void onClick() { a += 10; } public void execute() { double rand = Math.random(); respuesta = "El numero al hazar es " + rand + ", multiplicado por " + a + " = " + (rand * a); } public Integer getA() { return a; } public void setA(Integer a) { this.a = a; } public String getRespuesta() { return respuesta; } public void setRespuesta(String respuesta) { this.respuesta = respuesta; } public int getB() { b+=10; return b; } public void setB(int b) { this.b = b; }
14.5.4.1 Ejemplosencillo Cdigo:

<h:commandButton action=""> <f:ajax render="id1"/> </h:commandButton> /h:commandButton <h:outputText id="id1"/>
Interpretacin: Cuandosepulsaelbotn,vayaalservidor,ejecutelaaccin,calcularelvalordelelementodeJSF,cuyo ides"id1",enviaresevaloralcliente,yluegosustituireseelementoenelDOMconelnuevovalor.

CursodeJSP
Pagina69/70
Ejemplo:
<h:form prependId="false" id="form"> <h1>Ajax demo 1</h1> <h:commandButton action="#{AjaxDemo.onClick}" value="Agrega 10 a A"> <f:ajax render="id1" /> </h:commandButton> <br/> <h3>Valor de A: <h:outputText id="id1" value="#{AjaxDemo.a}" /> </h3> </h:form>
14.5.4.2 renderer:Especificacindeloselementosdeactualizacinenelcliente ResumendeCdigo

<f:ajax render="formId:elementId" />
Idea IdolistaseparadaporespaciosdelasidentificacionesdeloselementosdeJSFcuyosvaloresseparados porespaciosdebenserdevueltosdesdeelservidorysesustituyeenDOM Detalles Haycuatrovaloresespeciales:@este@formulario,ninguno@y@todos.Sinembargo,estossonms frecuentementeutilizadosparalaejecucindeatributosquelahacenatributo.Verseccindelexecute. Amenosqueutilice<h:formprependId="false"/>,elREALIDesFormID:elementId. 14.5.4.3 execute:Especificacindeloselementosaprocesarenservidor ResumendeCdigo
<f:ajax render="" execute="" />
Idea UnidentificadorolistadeidentificadoresJSFseparadaporespacioquedebeserenviadaalservidor parasuejecucin.Proejemplo,unh:inputText,queserprocesadonormalmente(setters,validacin, etc). Detalles Hay4valoresespeciales:@this@form,@none@all @this.Elelementoqueencierraf:ajax.Predeterminado. @form.Elh:formincluyendoaf:ajax.Muyconvenientesiustedtienevarioscamposparaenviar. @none.Nadadeloenviado.tilsielelementoquecambialosvaloresdehacercadavezquese evalen. @all.TodosloselementosdelainterfazdeusuarioJSFenlapgina. Ejemplo:
<h:form> <h:panelGrid columns="2"> Numero a multiplicar : <h:inputText id="a" size="5" value="#{AjaxDemo.a}"> </h:inputText> <h:commandButton action="#{AjaxDemo.execute}" value="Clic"> <f:ajax render="respuesta" execute="@form"></f:ajax> </h:commandButton> </h:panelGrid> <hr></hr> <h:outputText id="respuesta" value="#{AjaxDemo.respuesta}" /> </h:form>
CursodeJSP
Pagina70/70
14.5.4.4 event:mencionaracualeventodeusuariodebedispararlallamadaAjax ResumendeCdigo

<f:ajax Render="" event="" />
Idea NombredeleventoJuJavaScriptpararesponder.Noincluya"on",porloqueesmouseover,keyup,Blur, etc... Detalles Pordefecto Sieleventonoespecificado,pordefectoutilizado. Altoniveldeeventos JSFaade2Extras:accionyvalueChange. Ajustef:ajaxentornoaelementos <f:ajaxrender="">unmontndecomponentes</f:Ajax>aadeelcomportamientoAjaxenelevento pordefectoparacadacomponenteenvolvi. Accionespordefecto: action:h:CommandButton,h:commandLink Tengaencuentaquela"accin"espartedeJSF,ynounnombredeJavascriptnativoevento. Significaqueelbotnhasidoinvocadaencualquierforma(haciendoclicenl,ENTER,sitiene elfoco,elteclado,accesodirecto,etc). valueChange:h:inputText,h:inputSecret,h:inputTextarea,todoslosbotonesdeopcin,casillade verificacin,yloselementosdemen(h:selectOneMenu,etc), Unavezms,esteeventoesaadidoporJSFynoesunnombreJavascriptnativoevento. Diferentesnavegadoresmanejanun"cambio"demaneradiferente,porloqueesteunificael comportamiento. Tambintengaencuentaquees"valueChange"no",valuechange".Losacontecimientosnativas JavaScriptsonminsculas(mouseover,keyup,etc) Ejemplo:
<h:form prependId="false"> <h1>Ajax Event</h1> <h:commandButton action="#{AjaxDemo.onClick}" value="Agrega 10 a B"> <f:ajax render="id1" event="mouseover" /> </h:commandButton> <br/> <h3>Valor de B: <h:outputText id="id1" value="#{AjaxDemo.b}" /> </h3> </h:form>

Curso de Java Server Faces y Ajax

Загружено:

Сведения о документе

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Curso de Java Server Faces y Ajax

Загружено:

Авторское право:

Доступные форматы

Curso de Java Server Faces y Ajax

CuandocreamosunanuevapginaJSF,podemosescogerentredostiposdesintaxis:FaceletsoJSP. FaceletsusaunformatoXML(XHTML),yJSPusa...el formatoJSP. ElJSFusapginasJSPoXHTML,unarchivode configuracinXML(facesconfig.xml),yJavaPOJO's. ApartirdeJSF2.0,elformatoXMLeselestndar. Agregamoselarchivodeconfiguracin.

ElcdigoJSFenlapginaJSPsedebeencontrarentrelostags<f:view>y</f:view>. Comopodemosver,seincluyenlasdoslibrerasTaglib,queseusanluego,conlasetiquetas<f:>y<h:>. SiusamoselformatoXHTML,todoelcontenidoseconsideraJSF.

Labiblioteca<h:>contieneequivalentesdelHTML,yaseaformularios,botones,cajasdetexto, imgenes,etc... EnelfuturousaremoslosFaceletsynomaselJSP.

CadaetiquetapersonalizadadefinidaenelestndarHTMLhacerkitsecomponedelafuncionalidadde loscomponentes(definidosenlaclaseUIComponent)ylaprestacindeatributos(definidosporlaclase Renderer). ListadeetiquetasUIComponent

An HTML <table> element

Una tabla que se pueden actualizar de forma dinmica No aparece

An HTML <form> element

An HTML <img> element An HTML <input type=hidden> element

Una imagen No aparece

message messages outputFormat outputLabel

An HTML <a> element

Texto sin formato Una tabla Una fila de una tabla de

Un conjunto de casillas de verificacin Un cuadro de lista

Un cuadro combinado desplazable Un cuadro de lista

An HTML <select> element

Un cuadro combinado desplazable Un conjunto de botones de radio

An HTML <input type=radio> element

Comoseexplicaenelmodelodenavegacin,lanavegacinesunconjuntodereglasparalaeleccindela siguientepginaquesemuestradespusdeunbotnouncomponentedehipervnculosehaceclic. Lasreglasdenavegacinsedefinenenelexpedientedesolicitudderecursosdeconfiguracin.

Final success failure logon noresults

Loquesignificacomnmente Todohafuncionado.Iralapginasiguiente. Algoestmal.Iraunapginadeerror. Elusuariodebeiniciarsesinprimero.Iralapginadeiniciodesesin. Labsquedanoencontraronnada.Iralapginadebsquedadenuevo.

(opcional)Enelcampoderesultados,escribalacadenaresultadolgicodequelas referenciascomponenteactivodesuatributodeaccin. DelaAmenVer,seleccioneobusquelapginaqueseabrirsiestecasodenavegacin esseleccionadoporelsistemadenavegacin. HagaclicenAgregar.

LaimplementacindeJavaServerFacesprocesala<managedbeanscope>elementoenelmomentode iniciodelaaplicacin.Cuandounbeanesllamadolaprimeravezdelapgina,secreaunainstancia. Unautordelapginapuedeaccederalaspropiedadesdebeandelasetiquetasdecomponentesenla pginautilizandoelELunificada,comosemuestraaqu:

Tambinesposibleaprovecharlafuncindeanotacionesparaelbeanlogradoevitarlaconfiguracinde beangestionadoenarchivodeconfiguracinderecursosdeaplicacin. Ejemplo:

@ManagedBean(name = "Login") @RequestScoped public class Login {...}

Esasetiquetasdecomponentesquelasexpresionesmtododeusosonlasetiquetasylasetiquetasde componentesUIInputcomponenteUICommand. 3.8.1

Silasolicituddelapginaesunadevolucindedatos,unavistacorrespondienteaestapginayaexiste. Duranteestafase,laimplementacinJavaServerFacesrestauralavistamedianteelusodela informacindeestadoguardadaenelclienteoelservidor. 3.8.3

Duranteestafase,JavaServerFacesconstruyeelpuntodevistaydelegalaautoridadparael renderizadodelaspginas.Porejemplo,paraelcontenedordeJSPsilaaplicacineslautilizacinde pginasJSP.

Expresionesdeevaluacininmediatasonsiempredeslolecturaexpresionesdevalor.Laexpresin ejemploanteriorslosepuedeobtenerelpreciototaldecompradelgrano,nopuedeestablecerelprecio total. 4.2.2

/divmod% +(Binario) <><=>=ltgtlege ==!=eqne &&and ||or ?:

Enesteejemplo,laColeccinsehaespecificadoporelELcomoproductos.Eltemaactualescontenidaen elproductovariable.ElestadoactualdelaiteracinsecelebraenelestadodelobjetovarStatus.Muy sencillo.

Delosejemplosanteriores,esobvioque<c:import>proporcionamspotenciaqueconun<jsp:include>, sinembargo,tambinhayotrasrazonesparautilizarlasetiquetas.Haymejorasenelcontenidodelos recursosdebufferenlaJSTLqueeliminarelbufferinnecesarios.

ParaaquellosfamiliarizadosconelDriverManagerJDBC,<sql:setDataSource>esslounaenvoltura alrededordeesainstalacin.Sielatributodefuentededatosesunacadena,bienpodraserunaruta relativaaunrecursoJNDIounacadenadeparmetroJDBC. Unaconsultapuedeaccederalafuentededatos,as:<SQL:

Realizarlasactualizacionesylastransaccionesestansimple.Porejemplo,podemosdefiniruna transaccinydespuscualquiernmerodecambiosarealizarenesatransaccin.Estosemuestraenel ejemplosiguiente.

El<sql:dateParam> accinpuedeserusadoparafijarlosvaloresdelosmarcadoresdeparmetros(?)En unainstruccinSQL,paralosvaloresdejava.util.Date.Sibiennosemuestraenesteejemplo,es

root { display: block; } .logo{ font-size: 20px; color: teal; }

Porejemplo,sielcomponenteseasociaconunapropiedaddetipoboolean,JSFelijaelconvertidorde Boolean.Lostiposprimitivosseconviertenautomticamenteasushomlogosdeobjeto. Ademstieneconvertidorespredefinidosparafechasunmeros. 9.3.1

ParatodoslostiposbsicosdeJavaJSFusarautomticamentelosconvertidores.Perosideseadar formatoaunafechaobjetodeJSFproporcionaunaetiquetaconvertidor<f:convertDateTime>. Estaetiquetadebeseranidadasdentrodeuntagcomponentequeapoyalosconvertidores.

Estesegundoconvertidorsepuedepersonalizarmedianteelusodeatributosadicionales,esel convertidordeNmero. Elestilparamostrarnmerosenlosformatosdebasequetrabajaparalaconfiguracinregionaldel usuario.

minFractionDigits maxFractionDigits minIntegerDigits maxIntegerDigits pattern tipo

Parainvocarelconvertidor,ustednecesitajuntarcomounapropiedaddef:convertidoroasignarala propiedadConverterdelcomponentedeentrada. Ejemplo: Vamosacrearunconvertidorquevaalimpiarunnmerodetarjetadecrditodecualquiercarcterno numrico.

TambinlemostraremoscmoestenuevocomponenteinputEntryimprimeunasteriscoalladode laetiquetasiesnecesario="true". 11.1.1

Ahoraquetieneelcomponente,ustedtienequeregistrarlo.Paraello,medianteelusodeunanotacin @FacesComponent olainsercindelasiguienteslneasenfacesconfig.xml:

Creamosotromtodoparacodificarelcampodeentrada.SeabreelelementodeentradaHTML input,aadelosatributosconelmtodowriteAttribute,ycierraelelemento.Lostres parmetrosdewriteAttributesonelnombreyelvalordelatributoHTMLyelnombrede lapropiedaddelcomponente. Elresultadoesalgocomoelsiguienteelemento:

AntesdepoderutilizarlaetiquetapersonalizadaenJSPannecesidaddecrearunTLDaponerenla carpetaWEBINF/tlds/. curso.tld:

LapginaaincluiresunapginaJSFXHTML,yelcomponentequequeremosincluirseencuentra entre<ui:component>y</ui:component>. Losparametrosserecuperancon#{nombreDelParametro}.Seacceptancomoparametrostambien objetosJSFometodos. Ejemplomascomplejo,equivalenteaInputEntry: input_entry.xhtml:

<h:panelGrid border="1" columns="2"> <ui:insert name="izquierdo"/> <ui:insert name="derecho"/> </h:panelGrid>

Generalmente,nosinteresaejecutarnuestrocdigocuandolaconsultaestcompletayconestadoOK. EjemplodellamadaAjax: ajax_html.jsp:

Esunservletquevaadevolveruncontenidoestructuradoono.Puedesertexto,HTML,oXMLpor ejemplo. Enelejemploabajo,vamosarecuperarunnumeroalhazarsinsalirdelapgina. Ejemplo: ajax_java.jsp

Render:especificarloselementosaactualizarenelcliente Execute:especificarelementosparaprocesarenelservidor Event:especificarloseventosdeusuarioqueinicianlallamadaAjax onEvent:especificarlosscriptssecundarios(JavaScript)ainiciarlallamadaAjax Backedbeanutilizadoenlosejemplosabajo:

14.5.4.1 Ejemplosencillo Cdigo:

Interpretacin: Cuandosepulsaelbotn,vayaalservidor,ejecutelaaccin,calcularelvalordelelementodeJSF,cuyo ides"id1",enviaresevaloralcliente,yluegosustituireseelementoenelDOMconelnuevovalor.

14.5.4.2 renderer:Especificacindeloselementosdeactualizacinenelcliente ResumendeCdigo

14.5.4.4 event:mencionaracualeventodeusuariodebedispararlallamadaAjax ResumendeCdigo

Вам также может понравиться