En este artículo, aprenderás a configurar elementos de selección múltiple o única en un formulario. Al finalizar este tutorial, sabrás cómo crear condicionales y diversas opciones para facilitar la elección del usuario. Para que el proceso sea más claro y fácil de seguir, hemos incorporado GIFs animados que muestran los pasos interactivos clave.
*Nota: Los GIFs animados destacados en este tutorial resaltan las acciones interactivas más importantes, facilitando la comprensión y el seguimiento paso a paso.*
Comenzamos con la configuración de los elementos del formulario.
Step 1:
Trabaja en elementos de selección múltiple o única.

Step 2:
GIF animado: observa cómo se agregan los elementos al formulario, destacando las acciones más importantes a realizar en este paso.

Step 3:
Accede al menú de selección o de opciones de selección.

Step 4:
Configura un elemento de selección única, como solicitar al usuario que indique su regional de operación.

Step 5:
GIF animado: consulta este GIF para ver claramente cómo desplegar la lista de opciones e interactuar con el selector.

Step 6:
Si el elemento es autocompletado, digita al menos tres caracteres para que el sistema muestre los elementos coincidentes.

Step 7:
Configura el elemento y define si es dependiente de un elemento anterior o no.

Step 8:
GIF animado: el siguiente GIF te demuestra visualmente cómo interactuar con las opciones de respuesta y cuáles son los pasos destacados.

Step 9:
Selecciona las opciones para este caso.

Step 10:
Selecciona como opciones de listado: costa, regional, occidente, oriente, Antioquia y centro.

Step 11:
El sistema configura automáticamente las distintas opciones con su correspondiente configuración.

Step 12:
GIF animado: sigue el proceso mostrado en este GIF para guardar el elemento de selección única y visualizar los puntos importantes de la interacción.

Step 13:
Así se verá el formulario al diligenciarlo.

Para agregar un elemento de selección múltiple, sigue estos pasos:
Step 14:
Agrega un nuevo elemento.

Step 15:
Busca el tipo selección múltiple.

Step 16:
GIF animado: mira cómo se selecciona el elemento de selección múltiple y observa las acciones más importantes en este proceso.

Step 17:
Asigna, por ejemplo, ciudades como opciones del elemento.

Step 18:
Define si mantienes la presentación como lista desplegable o listas de chequeo.

Step 19:
GIF animado: consulta este GIF que resume los pasos interactivos clave para definir las opciones, como Medellín, Cali, Bogotá, Barranquilla y Bucaramanga.

Step 20:
Guarda el elemento. El sistema generará las condicionales correspondientes.

Estas son las principales funciones disponibles en las listas de selección. Configúralas empleando una lógica dependiente de estos elementos.


Continuando con lo que vimos en los vídeos anteriores, avanzaremos con la configuración de los elementos del formulario. En este caso, trabajaremos con elementos de selección múltiple o de selección única. Estos son básicamente selectores que nos ofrecen varias opciones para facilitar una elección.
Estos elementos también nos permitirán crear algunas condiciones dentro de nuestros formularios que nos guiarán en un flujo específico que queramos manejar. Para hacer esto, simplemente vamos a agregar elementos como ya lo hemos hecho antes, yendo al menú de selección o de opciones de selección.
En este caso, trabajaremos con un elemento de selección única donde podremos hacer una pregunta. Por ejemplo, pediremos que se diligencie cuál es la regional de operación. Este elemento será obligatorio, no lo incluiremos en los filtros, permitiremos que sea editable y lo dejaremos como un elemento desplegable.
Estas opciones de desplegable o autocompletado nos permiten generar diferentes formas de visualización. Si el elemento es una lista desplegable, simplemente daremos clic en el selector y se desplegará una lista de selección única. Si es autocompletado, deberemos teclear al menos tres caracteres para que el sistema nos muestre los elementos que coinciden con esos tres caracteres para poder seleccionar uno específicamente. Si el menú es corto, recomendamos siempre una lista desplegable.
Si el menú es demasiado extenso, la recomendación es usar autocompletado. En este caso, usaremos una lista desplegable.
Configuraremos el elemento y las opciones de respuesta estarán aquí. Aquí podemos definir si el elemento depende de un elemento anterior o no. En este caso, lo dejaremos como no dependiente.
Definiremos las opciones para este caso, escogeremos por lote y seleccionaremos el listado. Así, seleccionaremos como listado costa, regional, occidente, oriente, Antioquia y centro. De esta manera, ya tendríamos algunas definiciones específicas de selección múltiple que nos permitirán avanzar en el proceso. Esto nos permitirá tener una lista o un selector con los elementos que acabamos de definir.
El sistema se encargará de configurar las diferentes opciones con su correspondiente configuración. Así, podemos crear un condicional o una acción que dependa de la selección de este elemento o podemos ir al menú de acciones y configurar dicho elemento. Dejaremos la configuración de la lógica para un próximo vídeo.
Este elemento es particularmente seleccionable. Simplemente daremos guardar y con este mecanismo habremos creado un elemento de selección única para este caso. Así, aquí está el ejemplo.
Podremos seleccionar cualquiera de las opciones que definimos cuando diligenciamos el formulario.
Para la otra opción, simplemente podemos ir a agregar un elemento , buscar una selección múltiple y seleccionar el elemento de selección múltiple . Las opciones serán similares, por ejemplo, podemos establecer ciudades . En este caso específico, también puedo configurarlo como una lista desplegable o como una lista de verificación o un checkbox , donde se pueden verificar cada una de las opciones y definir cuáles son.
Entonces, para este caso, voy a definir ciudades como Medellín, Cali, Bogotá, Barranquilla, Bucaramanga . De esta manera, podríamos haber definido las ciudades de acuerdo a las regionales que hemos revisado. Una vez completado el proceso, simplemente guardamos . El sistema creará las condicionales y nos permitirá desplegar o tener la lista de verificación como queremos ver.
Estas son las principales funciones disponibles en las listas de selección y aquí podemos hacer una configuración a través de una lógica que dependerá de estos elementos. Más adelante, veremos cómo configurarlos .