curso richfaces 3.3.3 iii

25
I. Sesión 3 Noviembre 2010 Claudio Chaucca Umana [email protected]

Upload: eclaudioaugusto

Post on 09-Jun-2015

3.333 views

Category:

Technology


4 download

TRANSCRIPT

Page 1: Curso richfaces 3.3.3 III

I. Sesión 3

Noviembre 2010

Claudio Chaucca [email protected]

Page 2: Curso richfaces 3.3.3 III

Contenidos I Sesión 3

Librerías Core Ajax, UI and Ajax4Java (a4j) Ajax Support a4j:support, a4j:region, A4j:include,

a4j:poll, a4j:push Ajax Output

<a4j:include>,<a4j:mediaOutput>,<a4j:outputPanel> Rich Output

<rich:panel>,<rich:panelBar>,<rich:tabPanel> Rich Input Rich Select Caso: Mantenimiento de clientes.

Page 3: Curso richfaces 3.3.3 III

Ajax Support <a4j:actionparam> <a4j:region> <a4j:support> <a4j:poll> <a4j:push>

Page 4: Curso richfaces 3.3.3 III

<a4j:actionparam> <a4j:actionparam> Asigna el valor del atributo assignTo

a una propiedad del Manage Bean Nos permite actualizar los valores del modelo sin invocar

un código java. Atributos:

“name” nombre del parámetro “value” valor inicial del parámetro “assignTo” propiedad del Manage Bean

Page 5: Curso richfaces 3.3.3 III

<a4j:region> <a4j:region> especifica la parte del arbol de

componentes a ser procesados en el servidor. Todo el formulario es submitted pero solo la parte de la

región será procesado. Si no se especifica que región actualizar se actualiza la

región que inicia el Action.

Page 6: Curso richfaces 3.3.3 III

<a4j:support> <a4j:support> mas importante componente de la librería

RichFaces. Enriquece con capacidades ajax componentes no Ajax

JSF Todos los demás componentes RichFaces se basan en

el mismo principio Atributos:

event.- define el evento javaScript que dará soporte Ajax.

reRender.- define los ids de los componentes JSF a ser reRendered

Onsubmit.- código javaScript llamado antes del Ajax request

Oncomplete.- código javaScript llamado después del Ajax request

Page 7: Curso richfaces 3.3.3 III

<a4j:support>

Page 8: Curso richfaces 3.3.3 III

<a4j:poll> <a4j:poll> envía de forma periódica un AjaxRequest al

servidor. “interval” Indica la propiedad en milisegundos entre

response y request. “timeout” define el tiempo esperado para responder en

milisegundo, si no es recibido el response aborta el siguiente request.

Similar a un timer

Page 9: Curso richfaces 3.3.3 III

<a4j:push> <a4j:poll> ejecuta de forma periódica Ajax request al

servidor, simulando un push data. Envió de mensajes de forma asíncrona a diferencia del

<a4j:poll>

Page 10: Curso richfaces 3.3.3 III

Ajax Support Practica 20 minutos

Page 11: Curso richfaces 3.3.3 III

Ajax Output <a4j:include> <a4j:mediaOutput> <a4j:outputPanel>

Page 12: Curso richfaces 3.3.3 III

<a4j:keepAlive>,<a4j:include> <a4j:keepAlive>.- Mantiene con vida un bean por mas

de lo que dura un request durante una session <a4j:include>.- incluye paginas dentro de la pagina

padre. <a4j:include>.- usa las reglas de navegación estándar

JSF definidas en faces-config.xml

Page 13: Curso richfaces 3.3.3 III

<a4j:keepAlive>,<a4j:include>

Page 14: Curso richfaces 3.3.3 III

<a4j:keepAlive>,<a4j:include>

Page 15: Curso richfaces 3.3.3 III

<a4j:mediaOutput> Componente que facilita la generación de imagen, video,

sonido y otros binarios al vuelo Necesita 2 beans MediaBean con la función

paint(OutputStream out, Object data) y MediaData con las propiedades de la imagen

Page 16: Curso richfaces 3.3.3 III

<a4j:outputPanel> Es usado cuando sus componentes internos siempre

deben ser actualizados independientemente de la propiedad reRender

Practica 30 minutos (usar jFreeChart para generar la image)

Page 17: Curso richfaces 3.3.3 III

Rich output <rich:panel> <rich:panelBar><rich:panelBarItem> <rich:panelMenuGroup><rich:panelMenu><rich:panelMe

nuItem> <rich:tabPanel><rich:tab>

Page 18: Curso richfaces 3.3.3 III

<rich:panel>

Page 19: Curso richfaces 3.3.3 III

<rich:panel>

<f:form>

<rich:panel>

<f:faces>

<h:outpuText> <h:outputText> <h:inputText>

<h:panelGrid >

DOM Arbol de componentes

HtmlFormHtmlForm

HtmlPanelHtmlPanel

getFacetsgetFacets

HtmlOutputText

HtmlOutputText

HtmlPanelGrid

HtmlPanelGrid

HtmlOutputText

HtmlOutputText

HtmlInputText

HtmlInputText

Page 20: Curso richfaces 3.3.3 III

<rich:panel>

Page 21: Curso richfaces 3.3.3 III

<rich:panel> Practica 15 minutos, crear el control Panel desde java

Page 22: Curso richfaces 3.3.3 III

Rich output Practica 20 minutos

crear los sig controles desde java

<rich:tabPanel><rich:tab> <rich:panel> <rich:panelBar><rich:panelBarItem> <rich:panelMenuGroup><rich:panelMenu><rich:panelMenuItem>

Page 23: Curso richfaces 3.3.3 III

Rich inputPractica 20 minutos crear los controles desde java

<rich:calendar> <rich:comboBox> <rich:editor> <rich:fileUpload> <rich:inputNumberSlider> <rich:inputNumberSpinner> <rich:suggestionbox> <rich:progressBar>

Rich selects <rich:listShuttle> <rich:orderingList> <rich:pickList>

http://livedemo.exadel.com/richfaces-demo/richfaces/actionparam.jsf

Page 24: Curso richfaces 3.3.3 III

Caso : Mantenimiento de clientes (60 minutos)

Page 25: Curso richfaces 3.3.3 III

¡ Gracias !