Busca de endereço completo por CEP com jQuery e jSONP
Mais um exemplo muito simples de Cross-Domain script, ou transação entre sites via script. Desta vez, usaremos a função $.getScript do jQuery para acessar um banco de dados remoto, e retornar o endereço completo através do CEP.
Busca por CEP para preencher automaticamente endereços é extremamente útil em casos de cadastro, pois facilitar a vida do nosso querido usuário é tudo o que nós queremos certo? Então, como está função, ao digitar o CEP, é retornado automaticamente o endereço completo, bastando que ela informe um número! E o melhor, sem haver a necessidade de você ter um banco de dados!
Acessando Scripts Remotos
A idéia do script é bem simples. Nós recebemos o CEP que o usuário digitou, enviamos para um certo site o CEP passado e retornamos os resultado em forma de um vetor, com a rua, bairro, cidade e estado. Caso o CEP não seja encontrado, o usuário deverá preencher todos os campos manualmente.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Busca por CEP com jQuery</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<script type="text/javascript">
function getEndereco() {
if($.trim($("#cep").val()) != ""){
$.getScript("http://cep.republicavirtual.com.br/web_cep.php?formato=javascript&cep="+$("#cep").val(), function(){
if(resultadoCEP["tipo_logradouro"] != ''){
if (resultadoCEP["resultado"]) {
$("#rua").val(unescape(resultadoCEP["tipo_logradouro"]) + " " + unescape(resultadoCEP["logradouro"]));
$("#bairro").val(unescape(resultadoCEP["bairro"]));
$("#cidade").val(unescape(resultadoCEP["cidade"]));
$("#estado").val(unescape(resultadoCEP["uf"]));
$("#numero").focus();
}
}
});
}
}
</script>
</head>
<body>
<form>
CEP <input type="text" name="cep" id="cep" class="inputs" onblur="getEndereco()"/>
<br/>
Rua <input type="text" id="rua"/>
<br/>
Bairro <input type="text" id="bairro"/>
<br/>
Cidade <input type="text" id="cidade"/>
<br/>
UF <input type="text" id="estado"/>
<br/>
</form>
</body>
</html>
Espero ter ajudado e confira o exemplo:
http://projetos.lucaspeperaio.com/busca-por-cep-jquery/
Lucas Peperaio
Estudante de Ciência da Computação, trabalho com desenvolvimento web há 5 anos e com hardware há 8. Nas horas vagas, sou entusiasta de Overclock, Casemod e Benchmarks, além é claro dos Games. Apaixonado por informática e pela vida, procuro compartilhar meus conhecimentos e assim, ajudar as pessoas. Siga-me no youtube, posto semanalmente muito material sobre Hardware, tecnologia e games em geral: Clique aqui
Siga-me!
Boa dica! Eu modifiquei um pouco e espero que ajude também, abraço!
Código:
function getEndereco() { if($.trim($(‘#cep’).val()) != ”){ $(‘#aguarde’).html(‘Buscando endereço…’); $.getScript(‘http://cep.republicavirtual.com.br/web_cep.php?formato=javascript&cep=’ +$(‘#cep’).val(), function(){ if (resultadoCEP[‘resultado’] > 0){ var tip = unescape(resultadoCEP[‘tipo_logradouro’]); //Tipo de logradouro var log = unescape(resultadoCEP[‘logradouro’]); //Logradouro var bai = unescape(resultadoCEP[‘bairro’]); //Bairro var cid = unescape(resultadoCEP[‘cidade’]); //Cidade var est = unescape(resultadoCEP[‘uf’]); //Estado (UF)
$(‘#rua’).val(log ? tip+ ‘ ‘ +log : tip); $(‘#bairro’).val(bai); $(‘#cidade’).val(cid); $(‘#estado’).val(est); $(‘#rua’).focus(); $(‘#aguarde’).html(”); } else { $(‘#rua’).val(”); $(‘#bairro’).val(”); $(‘#cidade’).val(”); $(‘#estado’).val(”); } }); } }
Opa, legal cara, valeu pelo comentário
Muito util e muito funcional, facinho de entender até pra quem não ta tão acostumado con a linguagem….
valew!!
É uma pena que o http://cep.republicavirtual.com.br/ limite a quantidade de acesso.
Você sabe de alguma outra base virtual para esse tipo de consulta?
Matheus Bruno, você pode baixar o banco de dados deles e usá-lo em sua própria aplicação:
http://www.republicavirtual.com.br/cep/download/cep.sql.bz2
Prezado, testei usando CEPs Municipais tipo aqui em Florianópolis é 88000-000, Porto Alegre é 90000-000 Tentei sem o hífen claro, mas não retorna nenhum resultado. Alguma dica de como eu poderia resolver isso? Sabe dizer em que termos eu defino numa condicional para exibir pelo menos a cidade e estado, quando o CEP for como mencionei acima? Obrigado
Roberto, tive o mesmo problema com CEPs de determinadas cidades, provavelmente o WebService deles está desatualizado ou os CEPs são recentes