Saltar al contenido

Configurar un control como un enlace en Jitterbit App Builder

Un control se puede configurar para convertir su valor en un enlace, de manera que cuando los usuarios hagan clic en él, naveguen a otra página (dentro o fuera de la aplicación) o activen un evento. Esto funciona en la mayoría de tipos de control, incluyendo controles de Texto, Imagen y Lista. En esta página se describe cómo configurar este comportamiento.

Nota

Un control Botón tiene su propia opción Enlazar a página, que se configura al configurar su comportamiento al hacer clic, en lugar de seguir los pasos de esta página.

Para ver un ejemplo paso a paso que vincula un gráfico a una página con enlace automático, consulta Agregar análisis detallado de gráficos en el Apéndice C de la serie de tutoriales Introducción a App Builder.

Esto crea un enlace directo desde el valor de un control. Para enlazar un panel completo a otra página, incluyendo la manera en que se abre la página enlazada, consulta Configurar cómo se abren las páginas enlazadas.

Sigue estos pasos para configurar un control para que actúe como un enlace.

  1. Navega al control utilizando el Diseñador en vivo o el Banco de trabajo de la aplicación:

    • Desde la vista previa de la aplicación, abre la página que contiene el control y selecciona Cajón de acciones > Diseñador en vivo.

    • Desde el Banco de trabajo de la aplicación, abre la pestaña Páginas, luego en el panel Páginas, localiza la página que contiene el control y haz doble clic en su fila o haz clic en el icono Abrir registro. En el panel Diseño de panel de página, busca el panel que contiene el control y haz clic en Controles.

  2. Si estás en el Diseñador en vivo, haz clic en el control en la vista de página; esto rellenará el Diseñador en vivo con opciones de edición para ese control. Si estás en el Banco de trabajo de la aplicación, en el panel Controles, busca el control y haz doble clic en su fila o haz clic en el icono Abrir registro al final de su fila; App Builder abre un diálogo similar al del Diseñador en vivo.

  3. Haz clic en la pestaña Caso límite.

  4. Abre la sección Configuración de navegación rara. Tiene tres campos de nivel superior que se excluyen mutuamente; continúa con el que coincida con lo que deseas hacer:

    Campo Enlazar a página en la sección Configuración de navegación rara

    • Para enlazar a otra página en la aplicación, continúa con Enlazar a página a continuación.
    • Para activar uno de los eventos configurados del control, continúa con Evento a continuación.
    • Para enlazar a una URL externa u otra página de App Builder por dirección, continúa con Enlazar a URL a continuación.

Enlazar a página

Al seleccionar una página en el campo Enlazar a página también se revelan Evento, Estado inicial y Reemplazar página en historial:

Enlazar a página configurado en el acordeón Configuración de navegación rara, con Evento, Estado inicial y Reemplazar página en historial también mostrados

  1. En el campo Enlazar a página, selecciona la página de destino.

  2. Haz clic en el icono de enlace para abrir el diálogo Criterios de enlace de control y confirmar que App Builder vinculó las dos páginas en la columna correcta. Ajusta la Columna de origen si no se vinculó de la manera que esperabas.

  3. (Opcional) Establece Estado inicial para determinar en qué estado se carga la página enlazada: Agregar, Predeterminado o Editar, por ejemplo, abriendo directamente en modo de edición en lugar de su vista normal.

  4. (Opcional) Habilita Replace Page In History, que se comporta de la misma manera para controles que para elementos de menú y paneles; consulta Configurar cómo se abren las páginas vinculadas. Si el destino del vínculo de un control cambia a algo que no lo admite, App Builder lo desactiva automáticamente.

  5. Haz clic en Save.

Actualiza la vista de la aplicación para confirmar la actualización. El valor del control ahora se comporta como un vínculo: al hacer clic en él, el usuario accede a la página seleccionada, filtrada para ese registro.

Para vincular cada registro en un control List, Icon o Button a una página de destino diferente según sus datos, en lugar de una única página fija, consulta Vinculación dinámica de páginas.

Event

En lugar de vincular a una página o URL, un control puede activar uno de los eventos ya configurados en su tabla subyacente, tanto eventos intrínsecos como Delete y Save, como cualquier evento personalizado; consulta Configurar eventos. Al seleccionar uno, también se muestra Post Event en lugar de Link To Page y Link to URL, que desaparecen:

Event establecido en Delete en el acordeón Rare Navigation Settings, con Post Event también mostrado

  1. En el campo Event, selecciona el evento a activar.

  2. Configura Post Event en una de las siguientes opciones:

    • Close: Cierra la página o ventana emergente actual y vuelve a la anterior.
    • Stay: Permanece en la página actual.
    • Link to Page: Activa Link To Page y Link to URL, permitiéndote elegir la página o URL a la que navegar una vez que se complete el evento.

  3. Haz clic en Save.

Actualiza la vista de la aplicación para confirmar la actualización, luego activa el evento del control para confirmar que Post Event se comporta como esperas.

Un External Link adjunta una URL al control en su lugar, navegando a otra página en el servidor de App Builder o a un recurso web externo al hacer clic, por ejemplo, adjuntando uno a un control que muestra un número de seguimiento de FedEx, de modo que al hacer clic se abre la propia página de seguimiento de FedEx para ese número. Al seleccionar esto, también se muestran Event y Replace Page In History, igual que se describió anteriormente:

Link to URL ingresado en el acordeón Rare Navigation Settings, con Event y Replace Page In History también mostrados

  1. En el campo Link to URL, ingresa la URL completa. Por ejemplo: https://www.fedex.com/apps/fedextrack/?tracknumbers={{FedExTrackingNo}}. La URL debe comenzar con el protocolo https:// o http://.

  2. Para hacer el vínculo dinámico, utiliza llaves {{}} dentro de la URL para sustituir datos del objeto comercial en tu panel, como en el ejemplo anterior.

  3. Abre el acordeón Edge Case arriba y establece Link Target para controlar dónde se abre el vínculo:

    • _blank: Abre el vínculo en una pestaña o ventana nueva, según la configuración del navegador del usuario.
    • _parent: Abre el vínculo en el marco padre, si la aplicación se carga en un iframe de otra aplicación.
    • _self: Abre el vínculo en la ventana actual.
    • _top: Abre el vínculo en el marco más superior, si la aplicación se carga en múltiples iframes de otra aplicación.
    • App Builder: Abre el vínculo en la instancia actual de App Builder.
    • App Builder - Exit Frame Panel: Abre el vínculo en App Builder, saliendo del panel Frame; consulta Salir del panel Frame para más detalles.

    Nota

    Los campos exactos del acordeón Edge Case pueden variar según el panel que aloje el control.

  4. Haz clic en Save.

Actualiza la vista de la aplicación para confirmar la actualización, luego haz clic en el control para confirmar que abre la URL.