Visual Web Pack: Tips para Page Fragments

Por Tutorial Divas / Tutorial Divas

Hermosillo Sonora.- (14 de julio del 2007)

Tomado con permiso del autor de: http://blogs.sun.com/divas/

Tips para Trabajar con Page Fragments

Un Page Fragment permite agregar a una página un conjunto de elementos, que pueden ser componentes, action handlers o métodos. Cuando se agrega un Page Fragment a una página, se nos da la opción de seleccionar un Page Fragment existente o crear uno nuevo, y seguidamente el IDE agrega un tag  en la página que incluye el Page Fragment. Cuando se opta por crear un Page Fragment nuevo, el IDE agrega un archivo .jspf y su respectivo backing bean al proyecto web.

La directiva es diferente la acción estándar . La directiva causa que el contenido del Page Fragment sea incluído en el archivo .jsp antes que éste sea convertido a un Servlet por el application server.

El backing bean de un Page Fragment extiende la clase AbtractFragmentBean, y desafortunadamente no se proveen los métodos preprocess y prerender. Solamente se definen los métodos init y destroy. Cuando una persona navega a nuestra página y llega desde otra página o desde otro servidor (por ejemplo escribiendo la URL o haciendo click en una liga), y si es la primera vez que la página es invocada, el servidor crea una instancia del backing bean y ejecuta el método init(). Generalmente esto sucederá durante la fase de render response. Durante un postback (la página se invoca a sí misma), el hecho de que el estado que se guarda de los componentes incluye asociaciones con los elementos del Page Fragment causa que el application server genere la instancia del backing bean del Page Fragment mucho antes.

El método init() de un Page Fragment puede ser invocado en las primeras etapas del ciclo, y por lo mismo, no es posible obtener o establecer los valores de los componentes en init(). Por otro lado, el método init() puede ser llamado durante o después de invocar el método prerender() de la página principal. Una solución puede ser codificar un método en el Page Fragment e invocarlo dentro del método prerender() de la página principal. Por ejemplo, podemos incluír un método fragmentPrerender() en el backing bean del Page Fragment e invocarlo desde la página principal:

public void prerender() { TopFragment topFragment = (TopFragment)getBean("TopFragment"); topFragment.fragmentPrerender(); ... }

A continuación ejemplificamos algunas técnicas usuales para usar Page Fragments.

Pasar datos entre la página principal y el Page Fragment

Es posible pasar datos a un Page Fragment a través de algún managed bean (Application Bean, Session Bean, Request Bean), o a través de argumentos a funciones como se ilustra a continuación.

En el ejemplo siguiente, la página principal le proporciona información al Page Fragment mediante argumentos de un método:

public void prerender() { Bike bike = getSessionBean1().getBike(); ... PriceTable priceTable = (PriceTable) getBean("PriceTableFragment"); totalsSubtotalPrice.setText(priceTable.subtotal(bike)); }

En este ejemplo, la página principal establece valores en el request bean, el cual es utilizado por el Page Fragment para obtener los valores. El ejemplo está tomado de una aplicación web donde el usuario selecciona un elemento de un drop-down list en la página principal, la cual a su vez refresca el contenido de un data provider en el Page Fragment.

// Page Fragment public void fragmentPrerender() { if (getRequestBean1().getPersonId() != null) { try { getSessionBean1().getTripRowSet().setObject( 1, getRequestBean1().getPersonId()); tripDataProvider.refresh(); } catch (Exception e) { error("Cannot switch to person " + getRequestBean1().getPersonId().toString()); log("Cannot switch to person " + getRequestBean1().getPersonId().toString(), e); } } }

// Pagina principal public void prerender() { // Si no es un postback, establece la persona // por default if (getRequestBean1().getPersonId() == null) { try { personDataProvider.cursorFirst(); getRequestBean1().setPersonId( (Integer)personDataProvider.getValue("PERSON.PERSONID")); } catch (Exception e) { error("Cannot switch to person " + personDataProvider.getValue("PERSON.PERSONID")); log("Cannot switch to person " + personDataProvider.getValue("PERSON.PERSONID"), e); } } Fragment1 fragment1 = (Fragment1) getBean("Fragment1"); fragment1.fragmentPrerender(); }

Modificar propiedades de componentes en un Page Fragment

La página principal puede acceder y modificar los componentes en el Page Fragment a través del backing bean del mismo, como se muestra a continuación:

public void prerender() { Navigation navigationFragmentBean = ( Navigation)getBean("Navigation"); Hyperlink homeLink = navigationFragmentBean.getHomeLink(); homeLink.setDisabled(true); }

Como determinar en que página está incluído el Page Fragment

En este extracto de código, el Page Fragment cambia su apariencia en función de la página en donde está incluído.

public void fragmentPrerender() { // Si todo está listo, mostrar el botón checkout String page; String viewId = getFacesContext().getViewRoot().getViewId(); if (viewId == null || viewId.length() == 0 || "/".equals(viewId)) { page = ""; } else { int pos = viewId.lastIndexOf('/'); if (pos == viewId.length() - 1) { // last char in viewId is '/' viewId = viewId.substring(0, pos); pos = viewId.lastIndexOf('/'); } //ok if pos is -1, then pos+1 will be 0 page = viewId.substring(pos+1); } checkoutButton.setRendered(FINAL_ORDER_PAGE.equals(page)); }

Como utilizar un Tab Set en un Page Fragment para la Navegación del Sitio

Yossarian, un usuario de Creator/NetBeans, aportó un tutorial en la área comunitaria de documentos de Creator: Simple Page Fragment Menu Example.

Modificar dinámicamente un componente dentro de un Page Fragment

Aquí está un extracto de código donde la página principal dinámicamente construye un árbol en un Page Fragment.

public void makeTree() { Fragment2 pgfrag = (Fragment2)getBean("Fragment2"); List children = pgfrag.getDisplayTree().getChildren(); TreeNode personNode = new TreeNode(); personNode.setId("node1"); personNode.setText("Shari Oln"); children.add(personNode); }

Otros ejemplos

Winston hace referencia en su Blog al sitio de Josh, que utiliza Page Fragments para hacer cosas impresionantes. ¿Y que hay acerca de ti? ¿Tienes algún ejemplo de Page Fragments para compartir? En caso afirmativo, agrégenlos en los comentarios para que sean compartidos con otros desarrolladores de VWP.