En el artículo anterior comentamos como crear una tabla con el UI Element Table de Web Dynpro. Existe la posibilidad de que este elemento tenga estructura de árbol. Para ello, es necesario añadir una masterColumn que será la encargada de contraer o expandir los nodos. Existen dos tipos de masterColumn:
- TreeByKeyTableColumn
- TreeByNestingTableColumn
En este artículo se muestran los pasos de cómo crear una tabla con el primer tipo de columna maestra.
TreeByKeyTableColumn
El primer paso para crear una tabla árbol es como el de cualquier tabla, crear un nodo (cardinalidad 0…n o 1…n) en el contexto. En este nodo, a parte de los atributos que contienen la información que se quiere mostrar, es necesario definir los siguientes:
- ROW_KEY (String): La clave de la fila
- PARENT_KEY (String): La clave de la fila padre
- EXPANDED (WDY_BOOLEAN): Para controlar si la fila esta expandida o no.
- IS_LEAF (WDY_BOOLEAN): Para indicar si la fila es una hoja o no.
- NODE_CONTENT: Este atributo es opcional, y guardará la información de la columna maestra.
En el ejemplo de este artículo, tenemos dos atributos a mostrar, por lo tanto nuestro nodo del contexto quedará de la siguiente forma:
A continuación, se crea una tabla en el layout y añadimos las columnas de los atributos que queremos mostrar. En el ejemplo añadimos dos columnas con un text_view como cell_editor con la propiedad text bindeada a los atributos “columna1” y “columna2”.
Una vez creada la tabla, añadimos una masterColumn del tipo TreeByKeyTableColumn. En las propiedades de esta nueva columna, relacionamos los atributos que hemos creado con anterioridad:
La columna maestra también puede mostrar datos como cualquier columna, añadiéndole cualquier tipo de cell_editor. Lo que diferencia esta columna es que siempre estará en la primera posición, y que dará la opción de contraer o expandir los nodos de la tabla. En nuestro caso, añadimos otro text_view relacionado con el atributo “NODE_CONTENT”
Con estos pasos ya tenemos definida la tabla en el layout. Ahora, a la hora de rellenar el nodo del contexto que hace referencia a la tabla, será necesario que estos atributos tengan unos valores específicos, además de los datos que queremos mostrar. En el siguiente método se tiene un ejemplo de cómo crear una tabla con tres niveles, con tres hijos por nivel.
METHOD crear_arbol. DATA lo_nd_tabla_arbol TYPE REF TO if_wd_context_node. DATA lt_tabla_arbol TYPE wd_this->elements_tabla_arbol. DATA ls_tabla_arbol LIKE LINE OF lt_tabla_arbol. lo_nd_tabla_arbol = wd_context->get_child_node( name = wd_this->wdctx_tabla_arbol ). DATA: lvl1_index TYPE string, lvl2_index TYPE string, lvl3_index TYPE string. **Comenzamos el árbol * NIVEL 1 DO 3 TIMES. ** Como clave de fila cogemos el numero de iteración lvl1_index = sy-index. CONDENSE lvl1_index. ** Datos para la masterColumn ls_tabla_arbol-row_key = lvl1_index. ls_tabla_arbol-parent_key = ''."Como es el nivel 1 no tiene padre ls_tabla_arbol-is_leaf = abap_false."Como tiene hijos no es hoja ** Los datos a mostrar ls_tabla_arbol-node_content = ls_tabla_arbol-row_key. ls_tabla_arbol-columna1 = '1'. ls_tabla_arbol-columna2 = 'Rama'. ** Añadimos la fila a la tabla INSERT ls_tabla_arbol INTO TABLE lt_tabla_arbol. * NIVEL 2 DO 3 TIMES. ** Como clave de fila cogemos la clave del padre y el numero de iteración lvl2_index = sy-index. CONDENSE lvl2_index. CONCATENATE lvl1_index `.` lvl2_index INTO lvl2_index. ** Datos para la masterColumn ls_tabla_arbol-row_key = lvl2_index. ls_tabla_arbol-parent_key = lvl1_index."Clave del padre ls_tabla_arbol-is_leaf = abap_false."Como tiene hijos no es hoja ** Los datos a mostrar ls_tabla_arbol-node_content = ls_tabla_arbol-row_key. ls_tabla_arbol-columna1 = '2'. ls_tabla_arbol-columna2 = 'Rama'. ** Añadimos la fila a la tabla INSERT ls_tabla_arbol INTO TABLE lt_tabla_arbol. * NIVEL 3 DO 3 TIMES. ** Como clave de fila cogemos la clave de los padres y el numero de iteración lvl3_index = sy-index. CONDENSE lvl3_index. CONCATENATE lvl2_index `.` lvl3_index INTO lvl3_index. ** Datos para la masterColumn ls_tabla_arbol-row_key = lvl3_index. ls_tabla_arbol-parent_key = lvl2_index."Clave del padre ls_tabla_arbol-is_leaf = abap_true."Como no tiene hijos es hoja ** Los datos a mostrar ls_tabla_arbol-node_content = ls_tabla_arbol-row_key. ls_tabla_arbol-columna1 = '3'. ls_tabla_arbol-columna2 = 'Hoja'. ** Añadimos la fila a la tabla INSERT ls_tabla_arbol INTO TABLE lt_tabla_arbol. ENDDO. ENDDO. ENDDO. **Pasamos la tabla al contexto lo_nd_tabla_arbol->bind_table( new_items = lt_tabla_arbol set_initial_elements = abap_true ). ENDMETHOD.
Al ejecutar el método anterior, y con el layout definido como se ha comentado anteriormente, al abrir la aplicación Web Dynpro el resultado será una tabla como la de la siguiente imagen.
