rails y más cosas » jsf (java server faces) http://www.railsymas.com Nuevas Tecnologías Fri, 30 Jul 2010 22:45:13 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 Conexión jdbc en jsf http://www.railsymas.com/2010/07/25/conexion-jdbc-en-jsf/ http://www.railsymas.com/2010/07/25/conexion-jdbc-en-jsf/#comments Sun, 25 Jul 2010 20:25:49 +0000 admin http://www.railsymas.com/?p=1872 Ejemplo de conexión de una base de datos con el framework java server faces

La conexión se realiza mediante un fichero de configuración datasource, siendo más flexible para el desarrollo de una aplicación, ya que si en las clases de modelos se tienen que hacer en todas y cada una de ellas una configuración de los drivers específica de la aplicación, se pierde flexibilidad a la hora de extender y ampliar.

incorporación en el archivo web.xml del Conector

1
2
3
4
5
6

  <resource-ref>
      <description>DB Connection</description>
      <res-ref-name>jdbc/datasource</res-ref-name>
      <res-type>javax.sql.DataSource</res-type>
      <res-auth>Container</res-auth>     
  </resource-ref>

Configuración del fichero context.xml , igual que los ejemplos explicados de j2ee

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

<?xml version="1.0" encoding="UTF-8"?>
<Context path="/DBTest" docBase="DBTest"
        debug="5" reloadable="true" crossContext="true">
 
    <!-- maxActive: Maximum number of dB connections in pool. Make sure you
         configure your mysqld max_connections large enough to handle
         all of your db connections. Set to -1 for no limit.
         -->
 
    <!-- maxIdle: Maximum number of idle dB connections to retain in pool.
         Set to -1 for no limit.  See also the DBCP documentation on this
         and the minEvictableIdleTimeMillis configuration parameter.
         -->
 
    <!-- maxWait: Maximum time to wait for a dB connection to become available
         in ms, in this example 10 seconds. An Exception is thrown if
         this timeout is exceeded.  Set to -1 to wait indefinitely.
         -->
 
    <!-- username and password: MySQL dB username and password for dB connections  -->
 
    <!-- driverClassName: Class name for the old mm.mysql JDBC driver is
         org.gjt.mm.mysql.Driver - we recommend using Connector/J though.
         Class name for the official MySQL Connector/J driver is com.mysql.jdbc.Driver.
         -->
 
    <!-- url: The JDBC connection url for connecting to your MySQL dB.
         -->
 
  <Resource name="jdbc/datasource" auth="Container" type="javax.sql.DataSource"
               maxActive="100" maxIdle="30" maxWait="10000"
               username="root" password="root" driverClassName="com.mysql.jdbc.Driver"
               url="jdbc:mysql://localhost:3306/libros_jdbc"/>
 
</Context>

una vez creado los elementos necesarios para la conexión ya explicados en otros post creamos los formularios de recogida de datos y los bean asociados a los formularios

Bean libro.java asociado al formulariojdbc.jsp, creamos las propiedades de la tabla libros con los tres campos y sus correspondientes getters y setters

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

package beans;
 
public class Libros {
 
	private String titulo;
	private String autor;
	private String tematica;
 
	public String getTitulo() {
		return titulo;
	}
	public void setTitulo(String titulo) {
		this.titulo = titulo;
	}
	public String getAutor() {
		return autor;
	}
	public void setAutor(String autor) {
		this.autor = autor;
	}
	public String getTematica() {
		return tematica;
	}
	public void setTematica(String tematica) {
		this.tematica = tematica;
	}
 
 
 
 
}

Este bean es el encargado de recoger los datos del formulario, el formulario de jsf cuando detecta una etiqueta que hace referencia a un bean mediante el lenguaje de expresión intenta conectarse siendo necesario dar de alta en el fichero faces-config.xml el bean libros

1
2
3
4
5

 <managed-bean>
    <managed-bean-name>libroBean</managed-bean-name>
    <managed-bean-class>beans.Libros</managed-bean-class>
    <managed-bean-scope>request</managed-bean-scope> 
    </managed-bean>

nombre del bean para ser usado, path y ámbito

Código del formulariojdbc.jsf encargado de recoger los datos correspondientes al libro

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="../css/estilo.css" />
<title>formulario jsf jdbc</title>
</head>
<body>
 
<h2><h:outputText value="formulario libros"/></h2>
 
<div id="contenedor">
<h:form>
<div class="campo">
<h:outputText value="introduce el título"/>
<br/>
<h:inputText value="#{libroBean.titulo}"/>
</div>
<div class="campo">
<h:outputText value="introduce el autor"/>
<br/>
<h:inputText value="#{libroBean.autor}"/>
</div>
<div class="campo">
<h:outputText value="introduce la temática"/>
<br/>
<h:inputText value="#{libroBean.tematica}"/>
</div>
 
<h:commandButton action="almacenaraction" actionListener="#{almacenarlibro.insertarLibro}" value="enviar" styleClass="boton"/>
</h:form>
<div id="pie">
<p>www.railsymas.com</p>
</div>
 </div>
</body>
</f:view>
</html>

Bean encargado de la tramitación de los datos a la base de datos

1
2
3
4
5

 <managed-bean>
    <managed-bean-name>almacenarlibro</managed-bean-name>
    <managed-bean-class>conexion.OperacionesConexion</managed-bean-class>
    <managed-bean-scope>request</managed-bean-scope> 
    </managed-bean>

Imagen correspondiente al formulariojdbc.jsp


Código de la página listadojsf

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Listado libros</title>
<link rel="stylesheet" href="../css/estilo.css" type="text/css" />
</head>
<body>
<div id="contenedor">
 
<h2>Listado libros jdbc jsf</h2>
 
<div id="tabla">
<h:dataTable styleClass="tabla" value="#{almacenarlibro.listalibros}" var="libro" headerClass="cabeceratabla"
 columnClasses="impar,par,impar" cellspacing="2"  footerClass="pietabla">
 
  <h:column>
 
  <f:facet name="header">
 
  <h:outputText>T&iacute;tulo</h:outputText>
 
  </f:facet>
 
  <h:outputText value="#{libro.titulo}"/>
 
 
  </h:column>
  <h:column>
  <f:facet name="header">
  <h:outputText>Autor</h:outputText>
  </f:facet>
  <h:outputText value="#{libro.autor}"/> 
  </h:column>
  <h:column>
  <f:facet name="header">
  <h:outputText>Tem&aacute;tica</h:outputText>
  </f:facet>
  <h:outputText value="#{libro.tematica}"/>
 
  </h:column>
   <f:facet name="footer" >
   <h:outputText> listado tabla</h:outputText>
  </f:facet>
</h:dataTable>
</div>
<div id="pie">
<p>www.railsymas.com</p>
</div>
</div>
</body>
</f:view>
</html>
]]> http://www.railsymas.com/2010/07/25/conexion-jdbc-en-jsf/feed/ 0 Validando campos para jsf http://www.railsymas.com/2010/07/16/validando-campos-para-jsf/ http://www.railsymas.com/2010/07/16/validando-campos-para-jsf/#comments Fri, 16 Jul 2010 22:17:18 +0000 admin http://www.railsymas.com/?p=1851 Ejemplo de validación de algunos tipos de campos 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="../css/estilo.css"/>
 
<title>Formulario mensaje</title>
</head>
<body>
 
  <div id="contenedor">
 
   <div id="contenido">
 
   <h2> Formulario Mensajes</h2>
 
   <h:form>
 
   <div class="campo"> 
 
   <h:outputText value="#{mensaje.nombre}"/>
 
   <br/>
 
   <h:inputText  id="nombre" value="#{mensajesBean.nombre}"   required="true" />
 
 
   <h:message for="nombre" errorClass="errores" />
 
   </div>
 
 
   <div class="campo">
 
   <h:outputText value="#{mensaje.apellidos}"/>
 
   <br/>
 
   <h:inputText value="#{mensajesBean.apellidos}" required="true" id="apellidos"/>
 
   <h:message for="apellidos" errorClass="errores"/>
 
 
   </div>
 
 
   <div class="campo">
 
   <h:outputText value="#{mensaje.edad}"/>
 
   <br/>
 
 
 
   <h:inputText converter="#{BigInteger}" id="edad" value="#{mensajesBean.edad}" required="true" >
 
   <f:validateDoubleRange minimum="1" maximum="120" /> 
 
   </h:inputText>
 
   <h:message for="edad" errorClass="errores"/>
 
   </div>
 
 
   <div class="campo">
 
   <h:outputText value="introduce un número de teléfono"/>
 
   <br/>
 
   <h:inputText value="#{mensajesBean.telefono}" required="true" id="telefono">
 
 
   <f:validateLength minimum="9"/>   
 
   </h:inputText>
 
   <h:message for="telefono" errorClass="errores"/> 
 
   </div>
 
 
   <div class="campo">
 
   <h:outputText value="Introduce tu fecha de nacimiento"/>
 
   <h:inputText value="#{mensajesBean.fecha}" required="true" id="fecha">
 
     <f:convertDateTime pattern="M/d/yy hh:mm"  />
 
   </h:inputText>
 
   <h:message for="fecha" errorClass="errores"/>
 
   </div>
 
   <h:commandButton value="enviar" styleClass="boton" action="mensajeaction"/>
   <h:commandButton  action="cancelaraction" value="cancelar" styleClass="boton"  immediate="true"/>   
 
   </h:form>
 
   </div>
 
 
   <div id="pie">
 
   <p>www.railsymas.com</p>
 
   </div>
 
  </div>
 
</body>
</f:view>
</html>

configuración faces-confing.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

 <navigation-rule>
    <from-view-id>/pages/formulariomensajes.jsp</from-view-id>
    <navigation-case>
     <from-outcome>mensajeaction</from-outcome>
     <to-view-id>/pages/resultadomensaje.jsp</to-view-id>
    </navigation-case>
 
    </navigation-rule>
 
 
    <navigation-rule>
     <from-view-id>/pages/formulariomensajes.jsp</from-view-id>
     <navigation-case>
     <from-outcome>cancelaraction</from-outcome>
     <to-view-id>/pages/cancelada.jsp</to-view-id>
     </navigation-case>
 
    </navigation-rule>

Código de la página resulta

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><h:outputText value="#{mensaje.titulo}"/></title>
<link rel="stylesheet" href="../css/estilo.css" type="text/css" />
</head>
<body>
 
 
   <div id="contenedor">
 
      <div id="contenido">
 
 
          <div class="campo">
            <h:outputText value="Tu nombre:"/>
            <h:outputText value="#{mensajesBean.nombre}"/>            
          </div>
 
          <div class="campo">
            <h:outputText value="Tus apellidos:"/>
            <h:outputText value="#{mensajesBean.apellidos}"/>                      
          </div>
 
 
          <div class="campo">
            <h:outputText value="Tu edad:"/>
            <h:outputText value="#{mensajesBean.edad}"/>
          </div>
 
          <div class="campo">
 
           <h:outputText value="Tu teléfono:"/>
           <h:outputText value="#{mensajesBean.telefono}"/>
 
          </div>  
 
 
 
 
      </div>
 
      <div id="pie">
      <p>
         www.railsymas.com
      </p>
      </div>
 
   </div>
 
 
 
</body>
</f:view>
</html>

Los mensajes de errores correspondientes

Configuración del archivo face-config.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

  <application>
    <resource-bundle>
    <base-name>propiedades.message</base-name>
    <var>mensaje</var>   
    </resource-bundle>
 
 
    <locale-config>
    <default-locale>es_ES</default-locale>
    <supported-locale>en</supported-locale>    
    </locale-config> 
 
 
    <message-bundle>propiedades.erroresBundle</message-bundle>
 
    </application>

jsf a diferencia de struts o springframework donde los errores los validamos bien mediante clases específicas o mediante el framework struts-validator.xml en jsf existen una serie de mensajes estandar con los cuales jugar para obtener el resultado esperado

Código de erroresBundle.properties

1
2
3
4
5
6

 
javax.faces.component.UIInput.REQUIRED = Campo Requerido
javax.faces.validator.DoubleRangeValidator.NOT_IN_RANGE =  No esta en el rango entre 1 y 120
javax.faces.converter.BigIntegerConverter.BIGINTEGER= {0} Tiene que ser un número
javax.faces.validator.LengthValidator.MINIMUM = El número de teléfono debe ser de nueve mínimo
javax.faces.converter.DateTimeConverter.DATE = {0} no es una fecha correcta

Dirección con gran cantidad de mensajes javadabbadoo.org

]]> http://www.railsymas.com/2010/07/16/validando-campos-para-jsf/feed/ 2 Ejemplo simple facelets jsf http://www.railsymas.com/2010/07/15/ejemplo-simple-facelets-jsf/ http://www.railsymas.com/2010/07/15/ejemplo-simple-facelets-jsf/#comments Thu, 15 Jul 2010 23:58:28 +0000 admin http://www.railsymas.com/?p=1831 Para la versión jsf 1.2 de este framework

Sitio oficial para descarga de los jars https://facelets.dev.java.net/

Sitio oficial con documentación para desarrolladores https://facelets.dev.java.net/nonav/docs/dev/docbook.html

modificación del archivo faces-config.xml para la visualización

1
2
3

    <application>
     <view-handler>com.sun.facelets.FaceletViewHandler</view-handler>
    </application>

modificación del fichero web.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14

   <context-param>
    <param-name>facelets.DEVELOPMENT</param-name>
    <param-value>true</param-value>
  </context-param>
 
 
  <context-param>
   <param-name>javax.faces.DEFAULT_SUFFIX</param-name>
   <param-value>.xhtml</param-value>
  </context-param>
 
  <welcome-file-list>
    <welcome-file>index.xhtml</welcome-file>    
  </welcome-file-list>

modificamos el sufijo por defecto de las páginas de jsf a .xhtml

los facelets nos permiten crear plantillas en jsf de una forma rápida y comoda al cambiar el manejador de las vistas todas nuestras jsp tienen que ser renombradas a xhtml pero no es obligatorio

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

  <!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:ui="http://java.sun.com/jsf/facelets"
 xmlns:h="http://java.sun.com/jsf/html">
 
<head>
<link rel="stylesheet" href="../../css/estilo.css" type="text/css"/>
<ui:insert name="titulo"/>
</head>
<body>
  <div id="contenedor">  
 
  <div id="cabecera">
  <h2><ui:insert name="cabecera"/></h2>
  </div>
 
  <div id="contenido">  
  <ui:insert name="contenido"/>
  </div>
 
  <div id="pie">  
  <ui:insert name="pie"/>
  </div>
  </div>
</body>
</html>

Código de un cliente para la plantilla clienteplantilla.xhtml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

 <!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:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html">
 
 
 
 <ui:composition template="plantillasimple.xhtml">
 
	<ui:define name="cabecera">
 
		<h:outputText value="Ejemplo simple con facelets"/>
	</ui:define>
 
 
	<ui:define name="contenido">
 
	  <h:outputText value="cuerpo de la aplicación"/>
 
	</ui:define>
 
	<ui:define name="pie">
 
		<p><h:outputText value="www.railsymas.com"/></p>
	</ui:define>
 
 </ui:composition>
 
</html>

Resultado

]]> http://www.railsymas.com/2010/07/15/ejemplo-simple-facelets-jsf/feed/ 0 DataTable estilos de tabla http://www.railsymas.com/2010/07/10/datatable-estilos-de-tabla/ http://www.railsymas.com/2010/07/10/datatable-estilos-de-tabla/#comments Sat, 10 Jul 2010 21:38:12 +0000 admin http://www.railsymas.com/?p=1798 Ejemplo para el tratamiento de datos con dataTable de jsf

Declaramos el bean, con el nombre deportesBean y el path de la clase beans.Deportes y el ámbito de petición request

1
2
3
4
5

    <managed-bean>
    <managed-bean-name>deportesBean</managed-bean-name>
    <managed-bean-class>beans.Deportes</managed-bean-class>
    <managed-bean-scope>request</managed-bean-scope>    
    </managed-bean>

Declaramos la navegación del formulario desde formulariosdeportes enviando una petición de accion deportesaction para devolver el resultado en resultadodeportes

1
2
3
4
5
6
7

 <navigation-rule>
     <from-view-id>/pages/formulariodeportes.jsp</from-view-id>
     <navigation-case>
     <from-outcome>deportesaction</from-outcome>
     <to-view-id>/pages/resultadodeportes.jsp</to-view-id>  
     </navigation-case>
    </navigation-rule>

Declaramos el bean deportes

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

package beans;
 
import java.util.ArrayList;
 
public class Deportes {
 
	private ArrayList <String> listaDeportes;
 
	public ArrayList<String> getListaDeportes() {
		return listaDeportes;
	}
 
	public void setListaDeportes(ArrayList<String> listaDeportes) {
		this.listaDeportes = listaDeportes;
	}
 
 
 
 
}

Estilo.css

1
2
3
4
5
6
7
8
9
10

 
  .cabeceratabla {
   color:#ff2223;
   text-align:center;
  }
 
  .pietabla {
   color:#208123;
   text-align:center;
   }

formulariodeportes.jsp

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="../css/estilo.css"/>
<title>vistas</title>
 
</head>
<body>
   <div id="contenedor">
 
    <h2> Selecciona tus deportes favoritos </h2>
 
    <h:form>
 
     <h:outputText value="Selecciona tus deportes favoritos"/>
     <br/>
 
     <h:selectManyListbox value="#{deportesBean.listaDeportes}">
     <f:selectItem itemValue="baloncesto" itemLabel="baloncesto"/>
     <f:selectItem itemValue="balonmano" itemLabel="balonmano"/>
     <f:selectItem itemValue="fútbol" itemLabel="fútbol"/>
 
     </h:selectManyListbox>
 
     <br/>
 
     <h:commandButton value="enviar" action="deportesaction" styleClass="boton"/>
 
    </h:form>
 
    <div id="pie">
     <p>www.railsymas.com</p>
    </div>
   </div>
</body>
</f:view>
</html>

Código de resultadodeportes.jsp hacemos referencia en el datatable de los estilos en el header y footer de la tabla

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Resultado deportes</title>
<link rel="stylesheet" type="text/css" href="../css/estilo.css"/>
</head>
<body>
 
  <div id="contenedor">
 
  <h2> Resultado de Deportes </h2>
 
  <h:dataTable styleClass="tabla"  value="#{deportesBean.listaDeportes}" var="deporte" 
   headerClass="cabeceratabla" footerClass="pietabla">
  <h:column>
  <f:facet name="header">
   <h:outputText>Listado de Deportes Seleccionados</h:outputText>
  </f:facet>
 
 
  <h:outputText value="#{deporte}"/>
 
 
  <f:facet name="footer" >
   <h:outputText> pie de tabla</h:outputText>
  </f:facet>
  </h:column>  
  </h:dataTable>
 
 
  <div id="pie">
   <p>www.railsymas.com</p>
  </div>
 
  </div>
</body>
</f:view>
</html>

]]> http://www.railsymas.com/2010/07/10/datatable-estilos-de-tabla/feed/ 0 Etiquetas para los formularios jsf http://www.railsymas.com/2010/02/05/etiquetas-para-los-formularios-jsf/ http://www.railsymas.com/2010/02/05/etiquetas-para-los-formularios-jsf/#comments Fri, 05 Feb 2010 21:06:53 +0000 admin http://www.railsymas.com/?p=1213 En este post vamos a ver una serie de etiquetas que pueden ser la más utilizadas a la hora de crear un
formulario, con jsf

Código de la clase bean encargada del tratamiento de los datos del formulario

Se necesita una clase bean para la recogida de los datos y después la diferentes páginas web jsp, la configuración tanto del los bean como de las acciones en el archivo faces-config.xml

Bean encargado de tratar los datos

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69

package beans;
 
import java.util.ArrayList;
 
public class Etiquetas {
 
	private String nombre;
	private String apellidos;
	private String password;
	private String comentario;
	private Boolean fumador;
	private ArrayList <String> aficiones;
	private String profesion;
 
	private ArrayList <String> lenguajes;
 
 
	public String getProfesion() {
		return profesion;
	}
	public void setProfesion(String profesion) {
		this.profesion = profesion;
	}
 
	public ArrayList<String> getLenguajes() {
		return lenguajes;
	}
	public void setLenguajes(ArrayList<String> lenguajes) {
		this.lenguajes = lenguajes;
	}
	public ArrayList<String> getAficiones() {
		return aficiones;
	}
	public void setAficiones(ArrayList<String> aficiones) {
		this.aficiones = aficiones;
	}
	public Boolean getFumador() {
		return fumador;
	}
	public void setFumador(Boolean fumador) {
		this.fumador = fumador;
	}
	public String getComentario() {
		return comentario;
	}
	public void setComentario(String comentario) {
		this.comentario = comentario;
	}
	public String getNombre() {
		return nombre;
	}
	public void setNombre(String nombre) {
		this.nombre = nombre;
	}
	public String getApellidos() {
		return apellidos;
	}
	public void setApellidos(String apellidos) {
		this.apellidos = apellidos;
	}
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
 
 
}

formulario para mostrar los campos al usuario

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 
<f:loadBundle  basename="propiedades.message" var="mensaje"/>
<title>Utilizaci&oacute;n de etiquetas</title>
 
<link rel="stylesheet" href="../css/estilo.css" type="text/css"/>
</head>
<body>
 
 
  <div id="contenedor">
 
   <div id="contenido">
 
   <h2> Etiquetas html jsf </h2>
 
   <div id="imagen">
   <h:graphicImage  value="../imagenes/mundo.png" title="imagen"/>
   </div>
 
    <h:form>   
 
    <div class="campo">
   <h:outputText value="#{mensaje.nombre}"/>
    <br/>    
    <h:inputText value="#{etiquetasBean.nombre}"/>    
    </div>
 
    <div class="campo">  
    <h:outputText value="#{mensaje.apellidos}"/>    
    <br/>    
    <h:inputText value="#{etiquetasBean.apellidos}" maxlength="30" size="30" />
    <br/>
    </div>
 
    <div class="campo">    
    <h:outputText value="#{mensaje.password}"/>
    <br/>
    <h:inputSecret value="#{etiquetasBean.password}" maxlength="8" size="8"/>    
    </div>
 
    <div class="campo">    
    <h:outputText value="#{mensaje.comentario}"/>
    <br/>
    <h:inputTextarea rows="3" cols="10" value="#{etiquetasBean.comentario}"/>
    </div>
 
    <div class="campo">    
    <h:outputText value="#{mensaje.fumador}"/>
    <br/>
    <h:selectBooleanCheckbox value="#{etiquetasBean.fumador}"/> 
    </div>
 
 
 
    <div class="campo">
 
    <h:outputText value="#{mensaje.profesion}"/>    
    <br/>       
 
    <h:selectOneMenu value="#{etiquetasBean.profesion}">
 
    <f:selectItem itemValue="estudiante" itemLabel="Estudiante"/>
    <f:selectItem itemValue="programador" itemLabel="Programador"/>
    <f:selectItem itemValue="analista" itemLabel="Analista"/>
    <f:selectItem itemValue="diseñador" itemLabel="Diseñador"/>
 
    </h:selectOneMenu>    
    </div>
 
 
    <div class="campo">
    <h:outputText value="#{mensaje.aficiones}"/>
    <br/>
    <h:selectManyCheckbox value="#{etiquetasBean.aficiones}" layout="pageDirection">
    <f:selectItem itemValue="leer" itemLabel="Leer"/>
    <f:selectItem itemValue="cine" itemLabel="Cine"/>
    <f:selectItem itemValue="musica" itemLabel="Música"/>
    </h:selectManyCheckbox>      
    </div>
 
 
    <div class="campo">
 
    <h:outputText value="#{mensaje.lenguajes}"/>
 
    <br/>
 
    <h:selectManyListbox value="#{etiquetasBean.lenguajes}" >
 
    <f:selectItem itemValue="c" itemLabel="C"/>
    <f:selectItem itemValue="java" itemLabel="Java"/>
    <f:selectItem itemValue="struts" itemLabel="Struts"/>
    <f:selectItem itemValue="jsf" itemLabel="Jsf"/>
 
    </h:selectManyListbox>
 
 
    </div>
 
    <h:commandButton action="etiquetasaction"  styleClass="boton" value="enviar"/>
    </h:form>     
 
 
 
 
   </div>   
 
 
   <div id="pie">
    <p> www.railsymas.com </p>
   </div>
  </div>
 
 
</body>
</f:view>
</html>

jsp que muestra los resultados, se parecen al html tradicional, mencionar dataTable que sirve para mostrar datos como arrays colecciones maps etc.. . Cada valor individual viene representado por el atributo var.

Otra cosa a mencionar relevante, es el campo fumador que se saca en pantalla o no, según los datos introducidos,
un mensaje mediante jstl se aplica la lógica a la vista

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="f"  uri="http://java.sun.com/jsf/core"%>
<%@ taglib prefix="h"  uri="http://java.sun.com/jsf/html"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<f:loadBundle basename="propiedades.message" var="mensaje"/>
<link rel="stylesheet" type="text/css" href="../css/estilo.css"/>
<title><h:outputText value="#{mensaje.resultado}"/></title>
</head>
<body>
 
  <div id="contenedor">
 
  <div id="contenido">
 
  <h2> <h:outputText value="#{mensaje.resultado}"/> </h2>
 
  <div class="campo">
 
  <h:outputText value="nombre:"/>
 
  <h:outputText value="#{etiquetasBean.nombre}"/>  
 
  </div>
 
 
  <div class="campo">
  <h:outputText value="apellidos:"/>
 
  <h:outputText value="#{etiquetasBean.apellidos}"/>
  </div>
 
 
  <div class="campo">
 
  <h:outputText value="comentario:"/>
 
  <h:outputText value="#{etiquetasBean.comentario}" />
 
  </div>
 
  </div>
 
  <div class="campo">
 
 
  <h:outputText value="fumador:" />
 
 
 
  <c:if test="${requestScope.etiquetasBean.fumador == true}">
 
  <h:outputText value="es fumador "/>
 
  </c:if>
 
  <c:if test="${requestScope.etiquetasBean.fumador == false }">
 
 
  <h:outputText value="no es fumador"/>
 
  </c:if> 
 
  </div>
 
  <div class="campo">
 
  <h:outputText value="#{mensaje.aficionesr}"/>  
 
 
  <h:dataTable value="#{etiquetasBean.aficiones}" var="aficion" >
 
   <h:column>
 
   <h:outputText value="#{aficion}"/>
 
   </h:column>
 
  </h:dataTable>
 
  </div>
 
 
  <div class="campo">
 
  <h:outputText value="#{mensaje.profesionr}"/>
 
  <br/>
 
  <h:outputText value="#{etiquetasBean.profesion}"/> 
 
  </div>
 
 
  <div class="campo">
 
   <h:outputText value="#{mensaje.lenguajesr}"/>
 
   <h:dataTable value="#{etiquetasBean.lenguajes}" var="lenguaje">
 
   <h:column>
 
   <h:outputText value="#{lenguaje}"/>
 
   </h:column>
 
   </h:dataTable> 
 
 
  </div>
 
 
  <div id="pie">
    <p> www.railsymas.com </p>
  </div>
  </div>
 
</body>
</f:view>
</html>

]]> http://www.railsymas.com/2010/02/05/etiquetas-para-los-formularios-jsf/feed/ 0 Utilización del archivo de propiedades http://www.railsymas.com/2010/02/04/utilizacion-del-archivo-de-propiedades/ http://www.railsymas.com/2010/02/04/utilizacion-del-archivo-de-propiedades/#comments Thu, 04 Feb 2010 17:01:39 +0000 admin http://www.railsymas.com/?p=1206 Al igual que en otros frameworks se puede ulizar el archivo de propiedades para la declaración

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="css/estilo.css" type="text/css"/>
<f:loadBundle var="mensaje" basename="propiedades.message"/>
<title></title>
</head>
 <body>
 <div id="contenedor">
 <div id="contenido">
 <h:form>
 <p>
 <h:outputText value="#{mensaje.titulo}"/>
 </p>
 
 <h:outputText value=" #{mensaje.autor}"/>
 <br/>
 <h:inputText value="#{personaBean.nombre }" />
 <br/>
 
 <h:outputText value="#{mensaje.edad }"/>
 <br/>
 
 
 <h:inputText value="#{personaBean.edad}"/>
 
 <br/>
 <h:commandButton action="personaaction" styleClass="boton"  value="enviar" />
 
 </h:form>
 </div> 
 <div id="pie">
 <p> www.railsymas.com</p>
 </div>
 </div>
 </body>
 </f:view>
</html>

se crea un archivo de propiedades ejemplo message.properties dentro de un package llamado propiedades

1
2
3

 titulo  = Ejercicio Fichero properties
 autor  = El usuario del ejercicio 
 edad = Edad del usuario

f:view tiene que ponerse primero de f:loadboundle para que se tenga la referencia de propiedades, el atributo var es el identificador para ser usado en la jsp, y basename es la referencia al archivo de propiedades, src, package propiedades.message que el path al fichero properties.

Esto es válido para jsf 1.1 y 1.2, pero en 1.2 también se puede configurar en el faces-config.xml

1
2
3
4
5
6
7

 
    <application>
    <resource-bundle>
    <base-name>propiedades.message</base-name>
    <var>mensaje</var>   
    </resource-bundle>
    </application>

Obteniendo el mismo resultado

]]> http://www.railsymas.com/2010/02/04/utilizacion-del-archivo-de-propiedades/feed/ 0 formulario simple con jsf http://www.railsymas.com/2010/02/03/formulario-simple-con-jsf/ http://www.railsymas.com/2010/02/03/formulario-simple-con-jsf/#comments Wed, 03 Feb 2010 10:30:11 +0000 admin http://www.railsymas.com/?p=1169 En este ejemplo se vera como funciona jsf con los formularios, y cual es el ciclo de ejecución de una aplicación web con jsf.

Al trabajar con formularios, no solamente tenemos que trabajar con el aspecto visual, sino también con la parte del modelo de datos y de configuración.

index.jsp

1
2
3
4
5
6
7
8
9
10
11
12
13
14

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
 <jsp:forward page="ejercicios.jsf"/>  
 
</body> 
</html>

En jsf, como estamos utilizando páginas jsp, podemos hacer uso de los tags de jsp, en este caso se utiliza jps:forward para hacer un reenvio a la página jsp de ejercicios. Esta página Ejercicios.jsp sigue siendo una página jsp pero en el reenvio utilizamos la extensión jsf. Esto es debido a que hemos configurado el fichero web xml para que responda a las páginas con la extensión jsf.

Ejercicios.jsp

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="f"  uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib prefix="h"  uri="http://java.sun.com/jsf/html" prefix="h"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Ejercicios</title>
<link rel="stylesheet" href="css/estilo.css" type="text/css" />
</head>
<body>
<f:view>
  <div id="contenedor">
  <div id="contenido">
 
  <div class="enlace">
  <h:outputLink value="formulario.jsf"><h:outputText value="formulario1"/></h:outputLink>
  </div>
 
  </div>   
 
  <div id="pie">
  <p>www.railsymas.com</p>
  </div>
 
  </div>
 
</f:view>
</body>
</html>

La página ejercicios.jsp ya contiene el contenedor de jsf f:view para mostrar los componentes jsf, un link con outputLink y outputText

Dentro del package beans se crea la clase usuario

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

package beans;
 
public class Usuario {
 
	private String nombre;
 
	public String getNombre() {
		return nombre;
	}
 
	public void setNombre(String nombre) {
		this.nombre = nombre;
	}
 
 
 
}

Esta es la clase que va estar asociada con el formulario, necesitamos crear la clase y configurarla el el fichero faces-config.xml

configuracion del bean

1
2
3
4
5

 <managed-bean>
    <managed-bean-name>usuarioBean</managed-bean-name>
    <managed-bean-class>beans.Usuario</managed-bean-class>
    <managed-bean-scope>request</managed-bean-scope>
    </managed-bean>

campos el bean-name hace el el id utilazado para poder usar el bean, class es el path de la clase bean y scope es el ámbito del bean en este caso por petición

formulario.jsp

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

<%@ page language="java" contentType="text/html; charset=UTF-8"   pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Formulario</title>
<link rel="stylesheet" href="css/estilo.css" type="text/css"/>
</head>
<body>
<f:view>
  <div id="contenedor">
   <div id="contenido">
   <h2> Formulario usuario</h2>
   <h:form styleClass="formulario">
    <h:outputText value="Introduce tu nombre"/>
    <br/>
    <h:inputText value="#{usuarioBean.nombre}"/>
    <br/>
    <br/>   
    <h:commandButton value="enviar" styleClass="boton" action="usuarioaction" />
   </h:form>
   </div>
    <div id="pie">
     <p> www.railsymas.com </p>
     </div>
   </div>
</f:view>
</body>
</html>

Ahora podemos crear un formulario asociado al bean, f:view para ver los componentes jsf, y antes claro los tags jsf
f y h, para core y html. Para introducir datos en el formulario inputText son campos de entrada de datos en jsf, esos datos se guardaran en el bean correspondiente, mediante el name declarado usuarioBean y con el punto accedemos a la propiedad del bean.

Para enviar los datos hacemos uso de commadButton value el valor visual del botón action la acción donde van los datos para ser tramitados y styleClass para hacer uso de una clase de css y modificar el aspecto visual del botón.

1
2
3
4

 <servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>*.jsf</url-pattern>
  </servlet-mapping>

Cofiguración del servlet para jsf y rutas con *.jsf

El fichero de configuración faces-config.xml

1
2
3
4
5
6
7

 <navigation-rule>
    <from-view-id>/formulario.jsp</from-view-id>
    <navigation-case>
    <from-outcome>usuarioaction</from-outcome>
    <to-view-id>/pages/resultadousuario.jsp</to-view-id>    
    </navigation-case>
    </navigation-rule>

Declaración del archivo faces-confing.xml para la acción, estamos indicando que desde una página formulario.jsp se realiza una petición de acción llamada usuarioaction y el resultado se deriva a la vista /pages/resultadousuario.jsp

resultado usuario

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

<%@ page language="java" contentType="text/html; charset=UTF-8" 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">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Resultado Usuario</title>
</head>
<body>
<f:view>
 <h2> <h:outputText value="Bienvenido"/> </h2>
 <h:outputText value="#{usuarioBean.nombre}"/>
</f:view>
</body>
</html>

Mostramos los valores del bean mediante outputText, indicando #{nombrebean.propiedad}

]]> http://www.railsymas.com/2010/02/03/formulario-simple-con-jsf/feed/ 0 Holamundo con jsf http://www.railsymas.com/2010/01/28/holamundo-con-jsf/ http://www.railsymas.com/2010/01/28/holamundo-con-jsf/#comments Fri, 29 Jan 2010 00:07:51 +0000 admin http://www.railsymas.com/?p=1158 En el anterior post, habíamos visto la creación de un proyecto web dinámico, y la carga de las librerías necesarias para el proyecto

En jsf tenemos un fichero xml de configuración al igual que en struts, éste fichero es el faces-config.xml. y contamos con el fichero de despliegue web.xml.

Una página jsf, no es más que una página jsp con las taglib de jsf. de las librerías jsf cargadas,

Importante si no hemos cargado las librerías jstl en el directorio lib del proyecto eclipse nos da la siguiente excepción

1
2
3
4
5
6
7

excepción
 
javax.servlet.ServletException: La ejecución del Servlet lanzó una excepción
 
causa raíz
 
java.lang.NoClassDefFoundError: javax/servlet/jsp/jstl/core/Config

Creamos una página jsp nueva con el nombre de index

1
2
3
4
5
6
7
8
9
10
11

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
  holamundo
</body>
</html>

Ejecutamos el proyecto web y nos muesta el conocido holamundo, bien esto que parece exactamente igual que toda la vida en java para web, veremos las peculiariadades paso a paso.

url del proyecto http://localhost:8080/primerojsf/faces/index.jsp resultado holamundo
en la barra del navegador ponemos http://localhost:8080/primerojsf/index.jsf resultado holamundo
en la barra del navegador ponemos http://localhost:8080/primerojsf/index.faces resultado holamundo

Esto es debido a que en el fichero web.xml está mapeado así en el proyecto

1
2
3
4
5
6
7
8
9
10
11
12

<servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>/faces/*</url-pattern>
  </servlet-mapping>
<servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>*.jsf</url-pattern>
  </servlet-mapping>
  <servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>*.faces</url-pattern>
  </servlet-mapping>

Fragmento del web.xml donde se declara el nombre y la clase del servlet para jsf

1
2
3
4
5

<servlet>
    <servlet-name>Faces Servlet</servlet-name>
    <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
  </servlet>

Introducimos la librerías jsf en la página jsp

1
2
3

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

Mediante el atributo uri accedemos al recurso y mediante el atributo prefix, establecemos un identificador para poder hacer uso del recurso. En todos los libros de jsf suelen venir así, h y f, aunque para core se utilice f está bien, para luego no equivocarse y utilizar la librerías jstl, que tienen para su core y core_rt también el prefijo “c”.

El prefix se puede poner cualquiera pero se suelen utilizar estos por convención, así es más comodo leer código de otros desarrolladores

La etiqueta f:view establece un contenedor para de alto nivel para poder usar los componentes de la vista en jsf, sería como un jframe de java swing.

Mediante 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
 <f:view>
    <h:outputText value="holamundo"/> 
 </f:view>
</body>
</html>
]]> http://www.railsymas.com/2010/01/28/holamundo-con-jsf/feed/ 0 Introducción a jsf con eclipse http://www.railsymas.com/2010/01/22/introduccion-a-jsf-con-eclipse/ http://www.railsymas.com/2010/01/22/introduccion-a-jsf-con-eclipse/#comments Fri, 22 Jan 2010 20:15:35 +0000 admin http://www.railsymas.com/?p=1131 Vamos a utilizar la versión 1.2 de jsf, para lo cual necesitamos la versión de tomcat 6.0, dando que con la versión 5.5 da problemas.

Breve introducción teórica sobre jsf

Jsf es un framework ( un marco de desarrollo), al igual que struts y spring, desarrollado con la tecnología java. Jsf comparte semajanzas con jsp (java server pages) y con applets de java, ya que tiene unos componentes en la vista muy potentes.

Características generales

Representar componentes de interfaz de usuario (UI-User Interface) y manejar su estado

Se desarrolla el ejemplo sobre linux ubuntu pero es exactamente igual para windows, la configuración de tomcat seis igual que la del cinco, en este mismo sitio web se explicó en su día.

imagen del fichero descargado

Creamos un nuevo proyecto web dinámico

y configuramos para tomcat 6.0 y para la versión 1.2 de jsf

le damos a next y nos aparece una ventana de diálogo indicando el directorio de clases, volvemos a dar a next y nos aparece la ventana de diálogo de web module dejamos el nombre de proyecto y el directorio de contenido los que vienen por defecto “primerojsf” y “webcontent” y volvemos a dar a next

Pulsamos sobre el icono de librerias y le damos nombre

Ahora importamos los jar del fichero descargado para formar parte de la librería

Para jsf también utilizaremos jstl, para ello tenemos que descargarnos los archivos correspondientes para crear el proyecto web dinámico de eclipse para jsf

Este ejemplo está sobre eclipse galileo, pero vale Europa también, lo importante es la versión 6 para Tomcat.

Al descomprimir el fichero descargado nos despliegan una serie de directorios, vamos al directorio lib y alli nos interesan dos jar jsf-api.jar y jsf-impl.jar. Con ellos vamos a crear una librería para incorporar cada vez que se realice un proyecto jsf en eclipse

Descargamos los jar

Un proyecto nuevo web dinámico al igual que con j2ee, y tenemos dos opciones crear una librería con los jar descargados

El proyecto primerojsf tiene la siguiente estructura de directorios

]]> http://www.railsymas.com/2010/01/22/introduccion-a-jsf-con-eclipse/feed/ 0