A busca de endereço é um projeto criado para testar a funcionalidade de buscar o endereço pelo cep da ViaCEP. A página é feita em Html, Css e JavaScript.
Existe um formulário com os campos CEP, rua, bairro, cidade e estado onde o unico campo habilitado é o campo de CEP. Além dos campos de texto, também existem um botão que quando é ativado envia o que foi escrito no campo cep para uma função que busca o endereço. Se a busca for executada com sucesso, os outros campos disabilitados serão preenchidos com as suas determinadas informações.
- HTML
- CSS
- JavaScript
- BootStrap
- GoogleFonts
| buscaendereco
|----|--css
|--------|--index.css
|----|--page
|--------|--index.html
|----|--scripts
|--------|--buscacep.js
Existe duas funções que são as duas mais importantes do projeto. São elas a buscaEndereco() e callbackBusca().
function buscaEndereco(valor){
var cep = valor.replace(/\D/g,'');
if(cep != ""){
var validaCep = /^[0-9]{8}$/;
if(validaCep.test(cep)){
document.getElementById('rua').value="...";
document.getElementById('bairro').value="...";
document.getElementById('cidade').value="...";
document.getElementById('estado').value="...";
var script = document.createElement('script');
script.src = 'https://viacep.com.br/ws/'+ cep + '/json/?callback=callbackBusca';
document.body.appendChild(script);
}else{
limpaCampos();
alert("CEP Inválido!")
}
}else{
limpaCampos();
alert("Informe o CEP!")
}
}
Essa função é responsável por validar o cep que foi informado e envia-lo para a função do ViaCEP com o callback para receber o resultado da busca.
function callbackBusca(retorno){
if(!("erro" in retorno)){
document.getElementById('rua').value=(retorno.logradouro);
document.getElementById('bairro').value=(retorno.bairro);
document.getElementById('cidade').value=(retorno.localidade);
document.getElementById('estado').value=(retorno.uf);
}else{
limpaCampos();
alert("Cep Não Encontrado!");
}
}
Essa função é responsável por receber o resultado da busca da ViaCEP e validar as informções para mostrar na tela.
Para desenvolver esse projeto, como já foi citado, foi utilizado a função de busca da ViaCEP. Para mais informações segue o link abaixo:
https://viacep.com.br/exemplo/javascript/
Email: filipeassad@gmail.com
Skype: filipe.assad