09/06/2018
Programação
Olá pessoal, neste artigo será demonstrado como popular selects através de requisições AJAX a scripts em PHP, retornando os dados no formato JSON. Como exemplo, será construída uma página contendo listagens de Países, Estados e Cidades inseridas em selects, que serão filtrados conforme a opção selecionada.
Para construirmos esse exemplo, será necessário o seguinte ambiente de desenvolvimento, na seção links seguem endereço para downloads:
Pacote WampServer (pode ser outro da preferência do leitor);
Biblioteca jQuery (atualmente na versão 1.9.1);
Editor de texto (Bloco de Notas, Notepad++, Dreanweaver, etc.);
Será utilizado CSS para melhorar o visual da única página “index.php”, mas não serão detalhadas suas funcionalidades, pois o mesmo não faz parte do objetivo desse artigo, o nome do arquivo será “estilo.css”.
Para executarmos as requisições AJAX no formato JSON, será utilizada a função “$.getJSON()”, lembrando que ela pertence à biblioteca jQuery. Então se torna indispensável linkar na página o caminho para essa biblioteca.
Visando a simplicidade, do artigo será criado apenas um script de consulta PHP, “consulta.php”, onde através do método GET serão diferenciadas as funções de consultas (PAIS, ESTADO e CIDADE). Essas funções irão retornar os dados em JSON, para posteriormente serem consumidos pela função “$.getJSON()”.
Todos os dados estão gravados em uma base de dados “atlas” no MySQL, o que torna necessário configurar uma conexão com o banco para executarmos consultas. Será criado um arquivo conexao.php contendo o script de conexão em PDO.
Como exemplo, serão adicionados na página “index.php” 3 selects, onde, conforme for selecionado um País, serão carregados os estados daquele país no select “cmbEstado”, quando selecionado um estado, serão carregadas as cidades daquele estado no select “cmbCidade”, ou seja, um filtro bem dinâmico.
O nosso banco irá conter:
Todos os Países do mundo;
Todos Estados (somente do Angola);
Todas as Cidades (somente do Angola);
Observação: Por motivos obvieis, não foram cadastrados todos os estados de todos os países do mundo, o mesmo vale para cidades. No banco existe um cadastro aproximado de todos os Países, todos os estados do Brasil e aproximadamente todas as cidades do Brasil, mas já serve como exemplo para esse artigo.
Antes de iniciar o desenvolvimento, é interessante organizar os arquivos dentro da pasta principal do projeto para melhor entendimento e organização.
Fiquem atento no proximo artigo