Listas desplegables en cascada
Una lista desplegable en cascada es una serie de controles DropDownList dependientes en los que un control DropDownList depende del control DropDownList primario o anterior. Los elementos del control DropDownList se rellenan basándose en un elemento seleccionado por el usuario de otro control DropDownList.
Muestra del caso de uso
Para los fines de este tutorial, he usado Geonames REST API para demostrar esta capacidad.
Existen varias organizaciones que proporcionan este tipo de servicio y, siempre y cuando tengan API de REST bien documentadas, puede integrarse fácilmente con AEM Forms mediante la capacidad de integración de datos
Se siguieron los siguientes pasos para implementar listas desplegables en cascada en AEM Forms
Crear cuenta de desarrollador
Cree una cuenta de desarrollador con Geonames. Anote el nombre de usuario. Este nombre de usuario es necesario para invocar las API de REST de geonames.org.
Crear archivo Swagger/OpenAPI
La especificación OpenAPI (anteriormente Especificación de Swagger) es un formato de descripción de API para las API de REST. Un archivo OpenAPI permite describir toda la API, lo que incluye:
- Puntos finales (https://experienceleague.adobe.com/users?lang=es) y operaciones disponibles en cada punto final (GET /users, POST /users)
- Parámetros de operación Entrada y salida para cada operación
Métodos de autenticación - Información de contacto, licencia, condiciones de uso y otra información.
- Las especificaciones de API se pueden escribir en YAML o JSON. El formato es fácil de aprender y de leer tanto para humanos como para máquinas.
Para crear su primer archivo swagger/OpenAPI, siga la documentación de OpenAPI
Use el editor swagger para crear su archivo swagger y describir las operaciones que recuperan todos los países y elementos secundarios del país o estado. El archivo swagger se puede crear en formato JSON o YAML.
Creación de fuentes de datos
AEM Para integrar el servicio de datos de AEM Forms/con aplicaciones de terceros, necesitamos crear una fuente de datos en la configuración de los servicios en la nube. Use los archivos swagger para crear sus fuentes de datos.
Deberá crear 2 fuentes de datos (una para recuperar todos los países y otra para obtener los elementos secundarios)
Crear modelo de datos de formulario
La integración de datos de AEM Forms proporciona una interfaz de usuario intuitiva para crear y trabajar con modelos de datos de formulario. Base el modelo de datos de formulario en las fuentes de datos creadas en el paso anterior. Modelo de datos de formulario con 2 fuentes de datos
Crear formulario adaptable
GET Integre las invocaciones del modelo de datos de formulario con el formulario adaptable para rellenar las listas desplegables.
Cree un formulario adaptable con 2 listas desplegables. Uno para enumerar los países y otro para enumerar los estados o provincias según el país seleccionado.
Rellenar lista desplegable de países
La lista de países se rellena cuando se inicializa el formulario por primera vez. La siguiente captura de pantalla muestra el editor de reglas configurado para rellenar las opciones de la lista desplegable de país. Tendrá que proporcionar su nombre de usuario con la cuenta de geonames para que esto funcione.
Rellene la lista desplegable Estado o provincia
Es necesario rellenar la lista desplegable Estado/Provincia en función del país seleccionado. La siguiente captura de pantalla muestra la configuración del editor de reglas
Ejercicio
Agregue 2 listas desplegables denominadas condados y ciudades en el formulario para enumerar los condados y ciudades en función del país y el estado/provincia seleccionados.
Assets de muestra
Puede descargar los siguientes recursos para empezar a crear el ejemplo de la lista desplegable en cascada
Los archivos Swagger completados se pueden descargar desde aquí
Los archivos swagger describen la siguiente API de REST
El modelo de datos de formulario completado se puede descargar desde aquí