1. APLICACION JEE 5.0
ADF RICH FACES –TOPLINK JPA – DATA CONTROLS – ORACLE XE
Instructor : LEONARDO TORRES ALTEZ
Aplicación : Consulta de dos tablas : cabecera y detalle
Frameworks : JSF - ADF Rich Faces
APIS : JPA , Oracle Data Control, EJB
Tecnologias : AJAX
Requisitos : JDeveloper 11 , Internet Explorer 7.x ó Firefox 2.x , Oracle XE
1 Inicial el JDeveloper 11.
Clic en Nueva Aplicación …
2 Definir las propiedades de la
aplicación !
2. CREACION DE LA CAPA DE PERSISTENCIA ( BEANS MODELO JPA )
3 Una vez definida la aplicación nos
pedirá definir el proyecto ( sub
aplicación )
Un proyecto esta asociado a una
aplicación en Jdeveloper
4 En la vista de bases de datos clic
derecho en IDE Connection, escoger
New Connection
5 Nos conectaremos a la base de datos
Oracle Express que esta instalada en
su PC , definir las propiedades !
Hostname : 10.21.12.96
Username : hr
Password : 123
SID : XE
Para probar clic en Test Connection
3. 6 Si la conexión fue exitosa nos
conectaremos al esquema HR
7 Clic derecho sobre el proyecto
“model”
8 De la categoría TopLink JPA ,
escoger Entities from Tables
5. 1 Clic en la lupa
2
1 Escoger la conexión antes definida.
3 Clic en Copy Connection
1 Siguiente …
4
6. 1 Clic en Query y escoger las tablas
5 Employees y Departaments
Estas serán las tablas que usaremos
en la consulta Web
Se crearan los bean JPA a partir de
las tablas
1 Siguiente ..
6
7. 1 Siguiente …
7
1 Terminar …
8
1 Visualice el código generado
9
Crea una clase para cada tabla!
8. 2 Añadir el siguiente query a la clase
0 Employees :
@Entity
@NamedQueries({
@NamedQuery(name = quot;Employees.findAllquot;,
query = quot;select o from Employees oquot;)
,
@NamedQuery(name = quot;Employees.findByNamequot;,
query = quot;select o from Employees o where
o.firstName like :p_namequot;)
})
Alt + Enter para auto añadir los
imports
Las anotaciones son una forma
alternativa de crear “queries” JPQL
2 Clic derecho sobre persistente.xml y
1 escoger New Service Facade …
Esto creara un clase con los
métodos CRUD ( create , read ,
update, delete)
2 Clic en New Unit
2
Esto creara un nuevo Persistence
Unit JPA
11. 2 Agregar estas líneas debajo de TODO
7 , para buscar el primer empleado el
cual tenga el nombre empezando con
la letra “P”
Luego imprimiremos su apellido:
Employees a =
javaServiceFacade.queryEmployeesFindByName(quot;
P%quot;).get(0);
System.out.println(a.getLastName());
Este metodo main es solo de
prueba , con esto ejecutamos una
consulta para ver que JPA funciona
bien
2 Clic derecho sobre el código , y
8 escoger RUN
CREACION DE LA CAPA WEB ( JSF – LIBRERÍA ORACLE ADF RICH FACES )
12. 2 Crear otro proyecto ( Sub Aplicación )
9
3 Escoger propiedades !
0
13. 3 Modificar propiedades
1 Clic derecho / propiedades
3 Marcar modelo.jpr
2
Con esto marcamos la
dependencia de la capa web con la
capa de persistencia
14. 3 Escoger la categoría JSP Tag
3 Libraries ,escoger Add
3 Escoger la libreria !
4
Estas son las librerias de tags de
ADF Rich Faces
15. 3 Quedará de esta forma !
5
3 En la categoría Technology Scope ,
6 escoger ADF Faces
3 Quedará de esta forma
7
Con esto Jdeveloper nos agregara
librerias ( jars ) necesarios para
ejecutar JSF
16. 3 Escoger el archivo faces-config.xml ,
8
Con la paleta a la derecha ( JSF
Diagram Objects ) hacer elsiguiente
diagrama de flujo !
3 Clic derecho en crear pagina
9
17. 4 Escoger las propiedades
0
4 Arrastrar un componente “Panel
1 Strech Layout” a la pagina
browse.jspx
18. 4 Agregar un componente “Panel
2 Splitter” al centro
Clic derecho en JavaServiceFacade ,
escoger Create Data Control
Un “data control” es una
tecnologia que solo existe en
Oracle ADF , sirve para unir la capa
de persistencia con la capa web
4 Arrastrar “Departamets” de los data
3 controls
19. 4 Escoger Forms / ADF Read-only
4 Form
4 Marcar “Incluir Controles de
5 Navegación”
Escoger Aceptar
4 Quedará de esta forma !
6
20. 4 Escoger “employeeList” de los Data
7 Controls , arrastrarlos a la pagina
4 Escoger Tables / ADF Read-only
8 Table
4 Marcar “Sorting”
9
Escoger Aceptar
5 Cambiar la propiedad del “panel
0 Slipter” a vertical
21. 5 Arrastrar el área punteada hacia
1 abajo para dar mas espacio a los
controles
5 Ir a la pagina faces-config.xml , clic
2 derecho sobre browse.jspx y escoger
Run