List (tipo de control) en Jitterbit App Builder

Un control List permite que los usuarios seleccionen un valor de una lista predefinida de opciones en lugar de escribir texto libre, y también puede reemplazar el valor clave sin procesar de una columna con un título legible para los humanos. Por ejemplo, un panel Products podría usar un control List para que su campo Product muestre el nombre de cada producto en lugar del ID de producto subyacente.

Antes de poder usar el tipo de control List en una columna, necesitas un objeto de lista ya definido en la capa de negocio para proporcionar los valores del menú desplegable. Consulta Crear un objeto de lista en la Lección 3 de la serie de tutoriales Introducción a App Builder para saber cómo crear uno.

Agregar un control List

Para agregar un nuevo control List a un panel, usa el diálogo Agregar un control y selecciona List como el Tipo de control:

Esto revela los siguientes campos:

• Source: El objeto de lista que proporciona los valores del menú desplegable.
• Key (Column): La columna del objeto de origen que identifica de manera única cada registro, típicamente su clave principal.
• Title (Column): La columna del objeto de origen que contiene el valor legible para los humanos que se va a mostrar.

Si la columna que seleccionas es una clave externa, App Builder selecciona automáticamente List para ti. Si las columnas del objeto de lista de origen ya usan los tipos de uso de columna correctos, App Builder también rellena previamente Key (Column) y Title (Column).

Convertir un control existente a un control List

Para cambiar un control existente para usar el tipo de control List:

1. Navega al control, usando ya sea el Live Designer o el App Workbench:

   • Desde la vista previa de la app, abre la página que contiene el control y selecciona Action Drawer > Live Designer.

   • Desde el App Workbench, abre la pestaña Pages, luego en el panel Pages, localiza la página que contiene el control y ya sea haz doble clic en su fila o haz clic en el icono Open record. En el panel Page Panel Layout, encuentra el panel que contiene el control y haz clic en Controls.

2. Si estás en el Live Designer, haz clic en el control en la vista de página; esto poblará el Live Designer con opciones de edición para ese control. Si estás en el App Workbench, en el panel Controls, encuentra el control y ya sea haz doble clic en su fila o haz clic en el icono Open record al final de su fila; App Builder abre un diálogo similar al del Live Designer.

3. En la pestaña Control Properties, establece el campo Control Type en List.

4. En la pestaña List Options, configura los campos Source, Key (Column) y Title (Column) (consulta Agregar un control List para más detalles).

5. Haz clic en Save.

Actualiza la vista de la aplicación para confirmar la actualización. Ahora el control muestra el valor del título en lugar de la clave sin procesar, y al editar un registro, presenta las opciones disponibles como un menú desplegable en lugar de un campo de texto libre.

Mostrar un subtítulo en el menú de lista

El menú de un control List puede mostrar una segunda línea de texto, un subtítulo, debajo del título de cada opción. Por ejemplo, una lista de Product podría mostrar el nombre de cada producto como el título y su categoría como el subtítulo, para ayudar a distinguir entre productos con nombres similares.

Para configurar un subtítulo:

1. Navega al control, usando ya sea el Live Designer o el App Workbench:

2. Desde la vista previa de la aplicación, abre la página que contiene el control y selecciona Action Drawer > Live Designer.

3. Desde App Workbench, abre la pestaña Pages, luego en el panel Pages, localiza la página que contiene el control y haz doble clic en su fila o haz clic en el icono Open record. En el panel Page Panel Layout, busca el panel que aloja el control y haz clic en Controls.

4. Si estás en Live Designer, haz clic en el control en la vista de página; esto poblará Live Designer con opciones de edición para ese control. Si estás en App Workbench, en el panel Controls, busca el control y haz doble clic en su fila o haz clic en el icono Open record al final de su fila; App Builder abre un diálogo similar al de Live Designer.

5. En la pestaña List Options, expande List Properties (Additional) y establece Subtitle (Column) en la columna que deseas mostrar como subtítulo.

6. Haz clic en Save.

7. (Opcional) Para mantener el subtítulo visible incluso cuando el control está en modo de visualización, en lugar de solo mientras se selecciona un valor, abre la pestaña Edge Case y expande el grupo Rare List Properties (con prefijo del objeto de lista de origen del control, por ejemplo Region - Rare List Properties). Selecciona Keep subtitle in display mode y luego haz clic en Save nuevamente.

Actualiza la vista de la aplicación para confirmar la actualización.