Cómo crear Listas Desplegables Condicionales en Formularios de WordPress
Aprenda a crear listas desplegables condicionales en WordPress usando Formularios Formidables. Un método sencillo, sin código y sin consultas.
Buscando una forma de crear listas desplegables condicionales en formularios donde las opciones en un menú desplegable dependen de las selecciones que una persona hizo en los desplegables anteriores?
Por ejemplo, un formulario de concesionario de automóviles en el que un usuario selecciona primero el año de su automóvil, luego la marca y luego el modelo de una lista de opciones que solo se aplican al año/marca que ya seleccionó. Es posible que también haya escuchado estos tipos de formularios denominados chained select.
Esta funcionalidad es súper útil cuando crea formularios para manejar estimaciones de precios, cotizaciones, pagos, etc. También es ideal para los usuarios finales porque no tendrán que filtrar a través de toneladas de opciones irrelevantes.
Con Formidable Forms, puede configurar listas desplegables condicionales directamente desde una interfaz fácil de usar, sin necesidad de meterse con consultas complejas o soluciones de código personalizadas.
Sigue leyendo para obtener una guía paso a paso sobre cómo crear desplegables dependientes en WordPress con Formularios Formidables.
Cómo Crear Listas Desplegables Condicionales Con Formularios Formidables
Antes de profundizar en el tutorial detallado paso a paso, veamos de alto nivel cómo funcionan los formularios desplegables en cascada con Formularios Formidables.
- Cree un «formulario de datos» para alojar todos los datos que llenarán sus desplegables en cascada. Los usuarios finales no interactuarán directamente con este formulario, solo está ahí para guardar los datos.
- Rellene su «formulario de datos» con los datos que necesita agregando entradas. Si tienes un montón de datos, puedes ahorrar tiempo importando un archivo CSV, en lugar de intentar introducir todos los datos manualmente.
- Crear un segundo «formulario de usuario final». Esta es la forma con la que sus visitantes humanos interactuarán.
- Agregue campos de búsqueda al » formulario de usuario final «para que pueda extraer datos del» formulario de datos » según sea necesario para rellenar los menús desplegables.
Repasémoslo con más detalle
Para este ejemplo, usaremos un ejemplo de la industria automotriz con tres campos desplegables condicionales. La orden irá así:
- El usuario selecciona el año de su automóvil
- El usuario selecciona la marca de su automóvil de las marcas disponibles en ese año
- El usuario selecciona el modelo específico de su automóvil en función del año / marca que seleccionó
Cree el «Formulario de datos»
Para comenzar, cree un nuevo formulario para actuar como su «formulario de datos». De nuevo, sus usuarios finales no interactuarán directamente con este formulario, pero el «formulario de usuario final» que cree más adelante extraerá sus datos de las entradas de este formulario.
Luego, agregue un campo de texto para cada lista desplegable que desee incluir en su formulario de usuario final. Para nuestro ejemplo, serían tres campos de texto para:
- Año
- Marca
- Modelo
Luego, guarde su formulario.
Importar datos como Entradas de formulario
A continuación, deberá completar su «formulario de datos» con las opciones que desea mostrar en sus desplegables en cascada.
Para hacer esto, agregarás cada dato como una entrada de formulario.
Si tiene un conjunto de datos grande, el método más sencillo es importar un archivo CSV. Por ejemplo, nuestro conjunto de datos de automóviles tiene más de 7,000 filas, ¡eso no es algo que desee hacer manualmente!
Si no tiene muchos datos, también puede agregar entradas manualmente desde la pestaña Entradas de su formulario de datos.
Para importar un CSV a formularios Formidables, primero asegúrese de que los encabezados de su CSV coincidan con los campos de texto de su «formulario de datos».
En Excel, puede ver cómo nuestro CSV de ejemplo tiene tres columnas, cada una de las cuales coincide con los campos de texto que creamos en el paso anterior:
Una vez que tenga su archivo CSV listo…
- Vaya a Formidable → Importar / Exportar
- Use el botón Elegir archivo para seleccionar su archivo CSV
- Ingrese el delimitador CSV (esto casi siempre es una coma)
- Seleccione su «formulario de datos» en el menú desplegable Importar en formulario
- Haga clic en Cargar archivo e importar
En la siguiente pantalla, asegúrese de que los datos de su archivo CSV estén correctamente asignados a los campos correspondientes de su formulario. A continuación, haz clic en Importar:
Ahora tiene los datos que necesita para rellenar sus listas desplegables condicionales:
A continuación, es hora de crear listas desplegables dependientes con las que puedan interactuar sus visitantes.
Crear «Formulario de Usuario Final» y Agregar campos de búsqueda
A continuación, cree un nuevo formulario. Esta será la forma que verán sus visitantes humanos.
Una vez que tengas tu nuevo formulario, agrega un campo de búsqueda y dale un nombre, por ejemplo, «Seleccionar año».
A continuación, busque la configuración de Opciones de búsqueda en el campo Configuración y…
- Seleccione su formulario de datos utilizando el menú desplegable Seleccionar formulario
- Seleccione el campo de origen para extraer datos utilizando el menú desplegable Seleccionar campo, por ejemplo, «Año»
Asegúrese de guardar los cambios.
Luego, agregue otro campo de búsqueda y configúrelo para el siguiente conjunto de datos. Solo que ahora, también usarás el botón Ver un Campo de búsqueda para hacer que este campo de búsqueda dependa del campo de búsqueda anterior. Esto es lo que le permite mostrar solo las opciones que coinciden con el campo anterior y crear ese efecto «en cascada» :
Asegúrese de guardar los cambios.
Para agregar el menú desplegable final (por lo menos para nuestro ejemplo), debe agregar otro campo de búsqueda. Solo que ahora, usarás la opción Ver un campo de búsqueda para que dependa de los dos campos anteriores:
Si desea agregar más menús desplegables condicionales a su formulario, puede repetir el mismo patrón tantas veces como sea necesario.
Y eso es todo: si previsualizas tu formulario, deberías ver ese agradable efecto de cascada cuando interactúas con tu formulario:
Cree su Primera Lista Desplegable Condicional Hoy
Los formularios desplegables en cascada son un enfoque popular que hace una gran opción para formularios que involucran estimaciones de precios, cotizaciones, pagos, ubicaciones, etc.
Con Formularios Formidables, puede crear listas desplegables condicionales utilizando tantas condiciones como sea necesario, sin escribir consultas o código personalizados.
Para configurarlo, todo lo que necesita hacer es crear dos formularios y usar campos de búsqueda para conectar los dos. Para grandes conjuntos de datos, incluso puede importar un archivo CSV directamente desde Excel para rellenar su formulario de datos.
Para crear listas desplegables dependientes con Formularios Formidables, necesitará el plan básico de Formularios Formidables o superior.
Si aún no estás usando Formidable Forms Pro, obtén información sobre todas las útiles funciones del creador de formularios para comprender por qué Formidable Forms es el mejor plugin de formularios de WordPress para listas desplegables condicionales.