Mostrar el valor seleccionado en un aftable

Descripción: En este artículo veremos cómo tomar el valor seleccionado en una tabla (aftable) y mostrarlo en pantalla. Para ello usaremos bindings.

Partimos de una página donde hay un buscador, y un aftable que muestra los resultados de la búsqueda.

Para mostrar el elemento seleccionado utilizaremos un OutputText.

incluir outputText para mostrar valor seleccionado

Pero claro para poder mostrar el valor seleccionado en una tabla, no podemos tomar el valor directamente de ésta, sino a través del binding.
Para ello, debemos ir a la página de definición y crear un atributeValue.

se crea un attributeValue

Dentro del bloque bindings, se selecciona con el botón derecho y en el menú contextual seleccionamos Insert inside bindings, y luego atributeValues.

Al hacerlo se nos muestra la siguiente ventana.

attribute binding editor

Seleccionamos el campo que queremos mostrar. En este caso el apellido (LastName).

En el outputText, solo tenemos que indicar que en el atribute Value, vamos a tomar el valor del binding.
#{bindings.LastName}

Lo podemos hacer pulsando la opción "bind to data" que está justo encima, y que nos abrirá un cuadro para crear la expresión del lenguaje que irá.

asistente Expresiones

Nota: Es posible que en la parte izquierda no aparezca el valor que hemos creado con el atributeValue. En ese caso puedes probar a guardarlo todo, comprobar que se ha creado el atributeValue correctamente. Si está creado y no aparece en el cuadro, bastará con cerrar la página y volverla a abrir.

Podemos añadir, si queremos, un texto que acompañe al valor que seleccionamos.

añadimos un texto en el atributo Value

Ya podemos ejecutar la página y ver el resultado:

vista resultado

Como comprobamos, podemos seleccionar varios elementos, y no cambiar el texto inferior. Sólo cuando se pulsa el botón "Seleccionar", se produce el refresco de la pantalla, y en ese momento, también se refresca con el valor que ha pasado al binding.

En el próximo artículo veremos cómo refrescar el valor, sin necesidad de estar pulsando el botón seleccionar, a través del atributo autosubmit, partialsubmit y con el atributo Partialtriggers.


Artículos relacionados:
- Añadir una tabla (listado)
- Mostrar todos los elementos de una tabla (aftable)
- Refrescar componente con PartialSubmit y PartialTriggers