En entornos administrativos nos podemos encontrar con la exigencia de un tipo de formulario master/detail. Por ejemplo para navegar los empleados que tienen cierto departamento, o los clientes que adquirieron cada uno de nuestros productos. Basándonos en la aplicación de Recursos Humanos de Oracle haremos un maestro detalle para navegar por los departamentos de la empresa. Aplicación ejemplo en HRApplication.zip. Creamos una New > JSF Page, utilizando el template creado en artículos anteriores. Desde la paleta de componentes metemos un "Panel Spliter" que hacemos vertical para que la maestra quede encima de latabla detalle. De los "Data Controls" arrastramos el departmentsfindAll seleccionando "ADF Read-only Form", eliminamos todos los campos excepto los de departamento, e incluimos los botones de navegación:

Para crear el detalle seleccionamos de los "Data Controls" del anterior departmentsFindAll > employeesList, arrastrándola a el cuadrante inferior. Seleccionamos todos los campos relevantes al empleado, y filtrado, ordenar y seleccionar:

En la tabla-detalle-empleados selecciona de la ventana de propiedades Behaviour > PartialTriggers >Edit, selecciona los cuatro botones de la tabla maestro, para que cambie al tocarlos:

Para probar, Run sobre la página browse:

En este vista puedes comprobar la versatilidad de las tablas, puedes:

• Mover las columnas de sitio
• Ordenar por cualquier columna ascendente o descendente
•  Filtrar sobre cualquier columna con un string de búsqueda

Características que podrían ser muy interesantes en un entorno administrativo.

Veíamos en un post anterior como crear un proyecto básico para Weblogic. A partir de este vamos a crear una vista muy básica con JSF. JSF tiene varias ventajas:

• Cross browsing limpio: nos permite abstraernos de javascript y los estilos, y las peculiaridades de cada navegador
• Encapsula en componentes la vista
• Es xml de forma que es editable siempre
• Basado en estándares = XHTML + JavaScript + JSP + Java (JEE5+)
• Algunas librerías (oracle-ADF, richfaces, icefaces) permiten el desarrollo de Rich Inernet Applications

Como se describía en la especificación técnica las vistas se van a realizar con JSF 1.2, implementación de Oracle. En las propiedades del proyecto añadimos este Facet:

Managed Bean

Este objeto es el que se va a mapear en nuestros JSPs y va a alojar los datos en el servidor en todo momento. Por eso yo lo voy a clasificar como objeto de vista:

package view;

public class HelloBean {
    private String nombre = null;

    public String getSaludo() {
        return "Hola, "+nombre;
    }

    public String getNombre() {
        return nombre;
    }

    public void setNombre(String nombre) {
        this.nombre = nombre;
    }
}

Este Bean hay que mapearlo en el faces-config.xml:

Creando las JSPs

Creamos una nueva página JSP/JSF utilizando la plantilla "New JSF page (html)":

Con ayuda de la paleta que provee Eclipse, creamos los JSPs:

Creamos el formulario del nombre, petición, saludame.jsp:

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




Insert title here



    
    Soy: 
        
    

La respuesta, saludo.jsp:

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




Insert title here

Reglas de navegación

Creamos la regla de navegación en el faces-config.xml:

1. Seleccionamos la subpestaña Navigation Rules del fichero
2. Con ayuda de la paleta creamos el diagrama de navegación
3. En el Link ponemos el literal que va ha hacer cumplir la regla "saludar", en el action de saludame.jsp.

Prueba

Lo desplegamos en nuestro Weblogic, y sobre la dirección http://localhost:7001/wsc/faces/saludame.jsp , obtenemos el resultado:

In a previous project we saw how to create a Weblogic basic web project. Based on this we will create a very basic view with JSF. JSF has some advantages:

• Clean Cross browsing: we can forget styles and javascript, and navigator sigularities.
• Encapsulates the view components
• It is XML, then is text, then is always editable.
• Standards based = XHTML + JavaScript + JSP + Java (JEE5+)
• Some libraries (oracle-ADF, richfaces, icefaces) allow Rich Inernet Applications development.

How described technical espec we will make the views with JSF 1.2, Oracle implementation. We can add this facet in the project properties:

Managed Bean

This object will map our JSPs and will store the server data in the session. Then I will put as view object:

package view;

public class HelloBean {
    private String nombre = null;

    public String getSaludo() {
        return "Hola, "+nombre;
    }

    public String getNombre() {
        return nombre;
    }

    public void setNombre(String nombre) {
        this.nombre = nombre;
    }
}

We must map this bean in faces-config.xml:

Creating JSPs

We will create a JSP/JSF page using "New JSF page (html)" template:

The palette helps us to create the JSPs:

We will create a name request form, saludame.jsp:

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




Insert title here



    
    Soy: 
        
    

The response, saludo.jsp:

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




Insert title here



    

Navigation rules

We will create the navigation rule in faces-config.xml:

1. Select Navigation Rules tab in the file
2. The palete helps us to create the navigation diagram
3. In the link write the literal that fulfil the rule, in the action of saludame.jsp.

Test

Deploy your Weblogic, and in the address http://localhost:7001/wsc/faces/saludame.jsp , we take the following result: