Como criar listas suspensas condicionais em formulários WordPress
Aprenda como criar listas suspensas condicionais no WordPress usando formulários formidáveis. Um método simples, sem código e sem consulta.
procurando uma maneira de criar listas suspensas condicionais em formulários onde as opções em um menu suspenso dependem das seleções feitas por uma pessoa nos menus suspensos anteriores?
por exemplo, um formulário de Revendedor de automóveis em que um usuário seleciona primeiro o ano de seu carro, depois a marca, depois o modelo de uma lista de opções que se aplicam apenas ao ano/marca que já selecionou. Você também pode ter ouvido esses tipos de formulários chamados chained select.
esta funcionalidade é super útil quando você está criando formulários para lidar com estimativas de preços, cotações, pagamentos, etc. Também é ótimo para usuários finais porque eles não terão que filtrar toneladas de opções irrelevantes.
com formulários formidáveis, você pode configurar listas suspensas condicionais diretamente de uma interface amigável-não há necessidade de mexer com consultas complexas ou soluções de código personalizado.
Continue lendo para um guia passo a passo sobre como criar drop-downs dependentes no WordPress com formulários formidáveis.
como criar listas suspensas condicionais com formulários formidáveis
Antes de aprofundar o tutorial detalhado passo a passo, vamos examinar de alto nível como os formulários suspensos em cascata funcionam com formulários formidáveis.
- crie um” formulário de dados ” para abrigar todos os dados que preencherão seus drop-downs em cascata. Os usuários finais não irão interagir diretamente com este formulário-ele está lá apenas para armazenar os dados.
- preencha seu “formulário de dados” com os dados de que precisa adicionando entradas. Se você tiver uma tonelada de dados, poderá economizar tempo importando um CSV, em vez de tentar inserir manualmente todos os seus dados.
- crie um segundo “formulário de usuário final”. Esta é a forma com a qual seus visitantes humanos irão interagir.
- Adicione campos de pesquisa ao ” formulário do usuário final “para que ele possa extrair dados do” formulário de dados ” conforme necessário para preencher os drop-downs.
vamos passar por isso com mais detalhes…
para este exemplo, usaremos um exemplo da indústria automobilística com três campos suspensos condicionais. A ordem vai assim:
- Usuário seleciona o ano do seu carro
- Usuário seleciona a fazer de carro, de torna-los disponíveis no ano de
- Usuário seleciona o modelo específico de cada carro com base no ano/fazer que eles selecionados
Criar o “Formulário de Dados”
Para começar, crie um novo formulário para atuar como seu “formulário de dados”. Novamente, seus usuários finais não irão interagir diretamente com este formulário, mas o “formulário de usuário final” que você criar mais tarde retirará seus dados das entradas deste formulário.
em seguida, adicione um campo de texto para cada lista suspensa que você deseja incluir em seu formulário de usuário final. Para o nosso exemplo, que seria de três campos de texto para:
- Ano
- Fazer
- Modelo
em Seguida, guarde o formulário.
importar dados como entradas de formulário
em seguida, você precisará preencher seu “formulário de dados” com as opções que deseja exibir em cascata.
para fazer isso, você adicionará cada pedaço de dados como uma entrada de formulário.
se você tiver um conjunto de dados grande, o método mais fácil é importar um arquivo CSV. Por exemplo, nosso conjunto de dados de automóveis tem mais de 7.000 linhas-isso não é algo que você deseja fazer manualmente!
se você não tiver muitos dados, também poderá adicionar entradas manualmente na guia entradas do seu formulário de dados.
para importar um CSV para formulários formidáveis, primeiro certifique-se de que os títulos em seu CSV correspondam aos campos de texto em seu “formulário de dados”.
no Excel, você pode ver como nosso exemplo CSV tem três colunas, cada uma das quais corresponde aos campos de texto que criamos na etapa anterior:
Depois de ter o seu arquivo CSV pronto…
- Ir para o Formidável → Importar/Exportar
- Utilize o botão Escolher Arquivo para selecionar o arquivo CSV
- Introduza o CSV delimitador (isso é quase sempre uma vírgula)
- Selecione o “formulário de dados” a partir de o Importar Para o Formulário drop-down
- Clique em fazer Upload de arquivo e importar
Na tela seguinte, certifique-se de que os dados do seu arquivo CSV é devidamente mapeados para os campos correspondentes do formulário. Em seguida, clique em Importar:
Agora, você tem os dados necessários para preencher suas listas suspensas condicionais:
em seguida, é hora de criar listas suspensas dependentes para seus visitantes interagirem.
crie “formulário de usuário final” e adicione campos de pesquisa
em seguida, crie um novo formulário. Esta será a forma que seus visitantes humanos verão.
depois de ter seu novo formulário, adicione um campo de pesquisa e dê um nome – Por exemplo, “selecionar ano”.
em Seguida, localize a Pesquisa de Opções de configurações as Configurações de Campo e…
- Selecione o seu formulário de dados utilizando o Select de Formulário drop-down
- Selecione o campo origem, para extrair dados de utilização Selecione drop-down de Campo – por exemplo, “Ano”
certifique-se de salvar suas alterações.
em seguida, adicione outro campo de pesquisa e configure-o para o próximo conjunto de dados. Só agora, você também usará o botão Watch a Lookup Field para tornar esse campo de pesquisa dependente do campo de pesquisa anterior. É isso que permite exibir apenas opções que correspondem ao campo anterior e criar esse efeito de ” cascata:
certifique-se de salvar suas alterações.
para adicionar o drop-down final (por nosso exemplo, pelo menos), você adicionaria outro campo de pesquisa. Só agora, você usará a opção Watch a Lookup Field para torná-la dependente de ambos os campos anteriores:
se você quiser adicionar mais drop-downs condicionais ao seu formulário, você pode repetir o mesmo padrão quantas vezes forem necessárias.
E se você visualizar seu formulário, você deve ver que o bom efeito em cascata quando você interage com o seu formulário:
Crie Sua Primeira Condicional Lista Drop-Down de Hoje
drop-down em Cascata formas populares são uma abordagem que torna uma ótima opção para formulários envolvendo estimativas de preço, orçamentos, pagamentos, locais, etc.
com formulários formidáveis, você pode criar listas suspensas condicionais usando quantas condições forem necessárias, sem escrever nenhuma consulta ou código personalizado.
para configurá-lo, tudo o que você precisa fazer é criar dois formulários e usar campos de pesquisa para conectar os dois. Para conjuntos de dados grandes, você pode até importar um arquivo CSV diretamente do Excel para preencher seu formulário de dados.
para criar listas suspensas dependentes com formulários formidáveis, você precisará do Formidable Forms Basic plan ou superior.
se você ainda não estiver usando o Formidable Forms Pro, aprenda sobre todos os recursos úteis do form builder para entender por que o Formidable Forms é o melhor plugin de formulário WordPress para listas suspensas condicionais.