Ir para o conteúdo

Publicidade

 Estatísticas do Fórum

  • 0 Usuários ativos

    0 membro(s), 0 visitante(s) e 0 membros anônimo(s)

Cursos Online iMasters
Foto:

Consulta Cep Correio + Ajax

  • Por favor, faça o login para responder
60 respostas neste tópico

#1 Orides Tomkiel Zmovirzynsk

Orides Tomkiel Zmovirzynsk
  • Membros
  • 125 posts

Postado 15 fevereiro 2007 - 07:39

Bom dia Pessoal,

Estou disponibilizando um código de consulta ao WebService do Correio com direito a carregamento em Ajax, é só digitar o cep que ele completa o restante do endereco, esse código é adaptado a partir de dois sistemas que eu encontrei na net, se os autores quiserem que eu coloque os méritos me comuniquem que eu coloco o nome. ai vai:

Código Funcionando..


Código para baixar.

form.php // Formulario de consulta

<html>
  <head>
	<title>Busca Cep + Ajax + WebService Correio</title>
	<script type="text/javascript">
function addEvent(obj, evt, func) {
  if (obj.attachEvent) {
	return obj.attachEvent(("on"+evt), func);
  } else if (obj.addEventListener) {
	obj.addEventListener(evt, func, true);
	return true;
  }
  return false;
}
function XMLHTTPRequest() {
  try {
	return new XMLHttpRequest(); // FF, Safari, Konqueror, Opera, ...
  } catch(ee) {
	try {
	  return new ActiveXObject("Msxml2.XMLHTTP"); // activeX (IE5.5+/MSXML2+)
	} catch(e) {
	  try {
		return new ActiveXObject("Microsoft.XMLHTTP"); // activeX (IE5+/MSXML1)
	  } catch(E) {
		return false; // doesn't support
	  }
	}
  }
}
function buscarEndereco() {
var campos = {
  validcep: document.getElementById("validcep"),
  cep: document.getElementById("cep"),
  logradouro: document.getElementById("logradouro"),
  numero: document.getElementById("numero"),
  bairro: document.getElementById("bairro"),
  localidade: document.getElementById("localidade"),
  uf: document.getElementById("uf")
};
var ajax = XMLHTTPRequest();
ajax.open("GET", ("./webservice.php?cep=" + campos.cep.value.replace(/[^\d]*/, "")), true);
  ajax.onreadystatechange = function() {
  if (ajax.readyState == 1) {
  campos.logradouro.disabled = true;
  campos.logradouro.value = "carregando...";
  campos.bairro.disabled = true;
  campos.localidade.disabled = true;
  campos.bairro.value = "carregando...";
  campos.uf.disabled = true;
  campos.localidade.value = "carregando...";
  } else if (ajax.readyState == 4) {
  if(ajax.responseText == false){
	campos.validcep.innerHTML = "<strong>Cep invalido !</strong>";
	campos.logradouro.disabled = false;
	campos.logradouro.value = "";
	campos.bairro.disabled = false;
	campos.localidade.disabled = false;
	campos.bairro.value = "";
	campos.uf.disabled = false;
	campos.localidade.value = "";
  }else{
	campos.validcep.innerHTML = "";
	var r = ajax.responseText, i, logradouro, numero, bairro, localidade, uf;
	logradouro = r.substring(0, (i = r.indexOf(':')));
	campos.logradouro.disabled = false;
	campos.logradouro.value = unescape(logradouro.replace(/\+/g," "));
	r = r.substring(++i);
	bairro = r.substring(0, (i = r.indexOf(':')));
	campos.bairro.disabled = false;
	campos.bairro.value = unescape(bairro.replace(/\+/g," "));
	r = r.substring(++i);
	localidade = r.substring(0, (i = r.indexOf(':')));
	campos.localidade.disabled = false;
	campos.localidade.value = unescape(localidade.replace(/\+/g," "));
	r = r.substring(++i);
	uf = r.substring(0, (i = r.indexOf(';')));
	campos.uf.disabled = false;
	i = campos.uf.options.length;
	while (i--) {
	  if (campos.uf.options[i].getAttribute("value") == uf) {
	  break;
	  }
	}
	campos.uf.selectedIndex = i;
  }
  }
};
ajax.send(null);
}
window.addEvent(
  window,
  "load",
  function() {window.addEvent(document.getElementById("cep"), "blur", buscarEndereco);}
);
</script>
<style type"text/css">

body {
  margin: 0;
  padding: 30px 50px;
  font: 70% Verdana, Arial, sans-serif;
}
h1 {font-size: 140%;}
form {margin: 30px 50px 0;}
form fieldset {
  float: left;
  padding: 0 20px 10px;
  background: #e5e5e5;
  border-style: solid;
  border-width: 1px 2px 2px 1px;
  border-color: #AAA;
}
form legend {
  margin-bottom: 15px;
  padding: 5px 10px;
  background: #F5F5F5;
  border-style: solid;
  border-width: 1px 2px 2px 1px;
  border-color: #AAA;
  font-weight: bold;
}
form p {
  float: left;
  clear: both;
  margin: 0;
}
form label {
  float: left;
  clear: left;
  display: block;
  width: 90px;
  height: 30px;
  margin-right: 5px;
  padding-top: 3px;
  cursor: pointer;
  text-align: right;
  color: #C00;
}
form label.numero {clear: none; width: 60px;}
form label.uf {clear: none; width: 30px;}
form input {float: left; width: 200px;}
form input#numero, form input#uf {width: 50px;}
form input#bt-submit {width: 100px; margin-left: 150px;}
address {clear: both; padding: 30px 0;}
	</style>
  </head>
  <body>
	<form action="#" method="post" name="pai">
	  <fieldset>
		<legend>Informe o Cep</legend>
		<p>
		  <label for="cep">CEP</label>
	  <input type="text" name="cep" id="cep" onKeyDown="if(event.keyCode==13) event.keyCode=9;" />
  <div id="validcep" style="color: #FF0000;"></div>
		 </p>
		<p>
		  <label for="logradouro">Logradouro</label>
		  <input type="text" name="logradouro" id="logradouro" onKeyDown="if(event.keyCode==13) event.keyCode=9;" />
		  <label for="numero" class="numero">N&uacute;mero</label>
		  <input type="text" name="numero" id="numero" onKeyDown="if(event.keyCode==13) event.keyCode=9;" />
		</p>
		<p>
		  <label for="complemento">Complemento</label>
		  <input type="text" name="complemento" id="complemento" onKeyDown="if(event.keyCode==13) event.keyCode=9;" />
		</p>
		<p>
		  <label for="bairro">Bairro</label>
		  <input type="text" name="bairro" id="bairro" onKeyDown="if(event.keyCode==13) event.keyCode=9;" />
		</p>
		<p>
		  <label for="localidade">Localidade</label>
		  <input type="text" name="localidade" id="localidade" onKeyDown="if(event.keyCode==13) event.keyCode=9;" />
		  <label for="uf" class="uf">UF</label>
		  <select id="uf">
			<option value="">-- selecione --</option>
			<option value="AC">Acre</option>
			<option value="AL">Alagoas</option>
			<option value="AP">Amap&aacute;</option>
			<option value="AM">Amazonas</option>
			<option value="BA">Bahia</option>
			<option value="CE">Cear&aacute;</option>
			<option value="DF">Distrito Federal</option>
			<option value="ES">Esp&iacute;rito Santo</option>
			<option value="GO">Goi&aacute;s</option>
			<option value="MA">Maranh&atilde;o</option>
			<option value="MT">Mato Grosso</option>
			<option value="MS">Mato Grosso do Sul</option>
			<option value="MG">Minas Gerais</option>
			<option value="PA">Par&aacute;</option>
			<option value="PB">Para&iacute;ba</option>
			<option value="PR">Paran&aacute;</option>
			<option value="PE">Pernambuco</option>
			<option value="PI">Piau&iacute;</option>
			<option value="RJ">Rio de Janeiro</option>
			<option value="RN">Rio Grande do Norte</option>
			<option value="RS">Rio Grande do Sul</option>
			<option value="RO">Rond&ocirc;nia</option>
			<option value="RR">Roraima</option>
			<option value="SC">Santa Catarina</option>
			<option value="SP">S&atilde;o Paulo</option>
			<option value="SE">Sergipe</option>
			<option value="TO">Tocantins</option>
		  </select>
		</p>
		<p>
		  <input type="submit" id="bt-submit" value="Enviar" />
		</p>
	  </fieldset>
	</form>
  </body>
</html>

script.js // Responsavel pelo retorno dos dados

function ajax(url)
{
req = null;
if (window.XMLHttpRequest)
{
req = new XMLHttpRequest();
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send(null);
}
else if (window.ActiveXObject)
{
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req)
{
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send();
}
}
}

function processReqChange()
{
if (req.readyState == 4)
{
if (req.status ==200)
{
document.getElementById('pagina').innerHTML = req.responseText;
}
else
{
alert("Houve um problema ao obter os dados:n" + req.statusText);
}
}
}

webservice.php // Responsavel pela consulta ao WebService do correio

<?php

$CEP = $_GET['cep'];

$xml = <<<XML
<?xml version="1.0" encoding="utf-8" ?><s:Envelope xmlns:s='http://schemas.xmlsoap.org/soap/envelope/' xmlns:xsd='http://www.w3.org/2001/XMLSchema' xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance'><s:Body><Query xmlns='urn:Microsoft.Search'><queryXml xsi:type='xsd:string'>&lt;QueryPacket xmlns='urn:Microsoft.Search.Query' revision='1' build='(11.0.6360)' &gt;&lt;Query domain='{2698075D-E2F5-4254-87B2-7FC9E9AB0780}'&gt;&lt;QueryId&gt;{319A129A-014F-4A1B-9AC5-DA2DBFC62B7A}&lt;/QueryId&gt;&lt;OriginatorId&gt;{F6FF7BE0-F39C-4ddc-A7D0-09A4C6C647A5}&lt;/OriginatorId&gt;&lt;SupportedFormats&gt;&lt;Format revision='1'&gt;urn:Microsoft.Search.Response.Document:Document&lt;/Format&gt;&lt;Format revision='1'&gt;urn:Microsoft.Search.Response.Content:Content&lt;/Format&gt;&lt;Format revision='1'&gt;urn:Microsoft.Search.Response.Form:Form&lt;/Format&gt;&lt;/SupportedFormats&gt;&lt;Context&gt;&lt;QueryText type='STRING' language='pt-br' &gt;$CEP&lt;/QueryText&gt;&lt;LanguagePreference&gt;pt-br&lt;/LanguagePreference&gt;&lt;Requery&gt;&lt;/Requery&gt;&lt;/Context&gt;&lt;Range id='result'&gt;&lt;/Range&gt;&lt;OfficeContext xmlns='urn:Microsoft.Search.Query.Office.Context' revision='1'&gt;&lt;UserPreferences&gt;&lt;ParentalControl&gt;false&lt;/ParentalControl&gt;&lt;/UserPreferences&gt;&lt;ServiceData&gt;&lt;/ServiceData&gt;&lt;ApplicationContext&gt;&lt;Name&gt;Microsoft Office Word&lt;/Name&gt;&lt;Version&gt;(11.0.6360)&lt;/Version&gt;&lt;SystemInformation&gt;&lt;SkuLanguage&gt;pt-br&lt;/SkuLanguage&gt;&lt;LanguagePack&gt;pt-br&lt;/LanguagePack&gt;&lt;InterfaceLanguage&gt;pt-br&lt;/InterfaceLanguage&gt;&lt;Location&gt;BR&lt;/Location&gt;&lt;/SystemInformation&gt;&lt;/ApplicationContext&gt;&lt;QueryLanguage&gt;pt-br&lt;/QueryLanguage&gt;&lt;KeyboardLanguage&gt;pt-br&lt;/KeyboardLanguage&gt;&lt;/OfficeContext&gt;&lt;Keywords xmlns='urn:Microsoft.Search.Query.Office.Keywords' revision='1'&gt;&lt;QueryText&gt;90610-270&lt;/QueryText&gt;&lt;Keyword&gt;&lt;AltWord&gt;90610&lt;/AltWord&gt;&lt;/Keyword&gt;&lt;Keyword&gt;&lt;Word&gt;90610&lt;/Word&gt;&lt;/Keyword&gt;&lt;Keyword&gt;&lt;AltWord&gt;270&lt;/AltWord&gt;&lt;/Keyword&gt;&lt;Keyword&gt;&lt;Word&gt;270&lt;/Word&gt;&lt;/Keyword&gt;&lt;/Keywords&gt;&lt;/Query&gt;&lt;/QueryPacket&gt;</queryXml></Query></s:Body></s:Envelope>
XML;

$ch = curl_init();

curl_setopt($ch, CURLOPT_URL, 'http://consultacep.correios.com.br/office2003/Query.asmx?WSDL');
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-type: text/xml; charset=utf-8',
										   'SOAPAction: "urn:Microsoft.Search/Query"',
										   'Host: consultacep.correios.com.br'));
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $xml);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);

$xmlResponse = html_entity_decode(curl_exec($ch));

if (!preg_match('/\/><P>(?!<)([^<]+)<\/P>(?><P>(?!\d)([^<]+)<\/P><P>([^<]+)<\/P>)?/', $xmlResponse, $matches))
{

}
elseif (count($matches) == 2)
{
	list(, $cidade) = $matches;

	printf('<response><cidade>%s</cidade></response>', $cidade);
}
else
{
	list(, $rua, $bairro, $cidade) = $matches;

	$rua = utf8_decode($rua);
	$bairro = utf8_decode($bairro);
	$cidade = utf8_decode($cidade);

	$rua = $rua;
	$rua = trim($rua);
	$rua = explode("-", $rua);
	$rua = $rua[0];

	$cidade = $cidade;
	$cidade = trim($cidade);
	$cidade = explode("-", $cidade);
	$localidade = $cidade[0];

	$uf = trim($cidade[1]);

	header("Content-type: text/plain");
	echo urlencode($rua) . ":" . urlencode($bairro) . ":" . urlencode($localidade) . ":" . $uf . ";";

}

?>

Bom, é só isso, coloca tudo no server, execute o arquivo form.php indique um cep válido, depois eu disponibilizo o código direto para download e tambem coloco ele no server para deixar como teste, outra coisa, as vezes o servico do correio se encontra fora do ar, impossibiltando o uso deste sistema.

att,

Orides Tomkiel Zmovirzynski
orides@midiaville.com.br
www.midiaville.com.br
  • 0

#2 Iso

Iso
  • Membros
  • 56 posts

Postado 22 fevereiro 2007 - 10:58

Olá, puxa vida tava alguns dias tentando fazer isso, testei mas acho q tem algo faltando, pois ao informar o cep, no campo logradouro aparece a mensagem : "<br /><b>Fatal error</b" e no campo bairro aparece "Call to undefined function curl_init() in <b>C"
qq eu fiz errado? eu só copiei e executei

se puderes me ajudar ficarei muito feliz, eu estava desistindo já de fazer isso

Grata
  • 0

#3 Falcão

Falcão
  • Membros
  • 1 posts

Postado 23 fevereiro 2007 - 12:52

Olá, puxa vida tava alguns dias tentando fazer isso, testei mas acho q tem algo faltando, pois ao informar o cep, no campo logradouro aparece a mensagem : "<br /><b>Fatal error</b" e no campo bairro aparece "Call to undefined function curl_init() in <b>C"
qq eu fiz errado? eu só copiei e executei

se puderes me ajudar ficarei muito feliz, eu estava desistindo já de fazer isso

Grata


Fala Iso, eu tive o mesmo problema aqui, mas consegui resolver ativando a biblioteca CURL no php.ini. (descomente a linha "extension=php_curl.dll").

Depois disso funcionou sem problema.

[]s
Falcão


Meu amigo, você está de parabéns. Funcionou perfeitamente. Excelente post.

[]s
Falcão
  • 0

#4 Orides Tomkiel Zmovirzynsk

Orides Tomkiel Zmovirzynsk
  • Membros
  • 125 posts

Postado 23 fevereiro 2007 - 14:25

Obrigado Falcão, aqui no forum muito diferente de outros é um pouco dificil receber um elogio, quanto ao problema da iso, na minha máquina não precisou estar a biblioteca curl descomentada, mas ai vai um código para verificar se ela está ou não ativa:

<?
if(function_exists("curl_init")){
echo "<font color='#009900'><h3>A biblioteca curl está instalada !</h3></font>";
} else {
echo "<font color='#FF000000'><h3>A biblioteca curl não está instalada !</h3></font>";
}
?>

se não estiver descomente a biblioteca no php.ini e reinicie o apache. para quem quiser baixar o código tem aqui e para quem quiser ver funcionando pode ver aqui.

Att,

Orides Tomkiel Zmovirzynski.
  • 0

#5 Iso

Iso
  • Membros
  • 56 posts

Postado 26 fevereiro 2007 - 08:18

Olá,
Queria agradecer as respostas, vou entrar muito nesse fórum daqui pra frente, quando eu souber mais quem sabe posso responder algumas questões tbm.
Depois de ter descomentado a extension funcionou.
Mas tem um detalhe, está usando o banco de dados dos correios, certo? no site dos correios quando pesquiso pelo cep 89150-000 é retornado o endereço certinho mas pelo programa aqui não está retornado nada. Alguém pode verificar pra mim se não aparece na máquina de vcs tbm? talvez eu tenha q fazer mais alguma coisa, sei lá, mas acho q não pq com outros ceps funcionou.
Obrigada,
Iso

ah... e se não for pedir demais, alguém tem o código q retorna o cep ao invés do endereço?
gostaria q funcionasse pros dois casos
vlw
  • 0

#6 Orides Tomkiel Zmovirzynsk

Orides Tomkiel Zmovirzynsk
  • Membros
  • 125 posts

Postado 26 fevereiro 2007 - 10:30

Olá Iso, se voce quiser eu tenho a base de cep atualizada no ano de 2004 no formato para mysql, está bem atualizada até, ai ao inves de buscar no correio voce pode buscar direto na sua base de dados, ai fica melhor para voce fazer tanto busca por cep quanto busca por correio, mas já vou avisando que a base é bem grande.

Um abraço e até.

att,

Orides Tomkiel Zmovirzynski
orides@midiaville.com.br
www.midiaville.com.br
  • 0

#7 Iso

Iso
  • Membros
  • 56 posts

Postado 26 fevereiro 2007 - 15:24

Orides! você acha q a consulta pelo office não é atualizada?
é q achei um código fonte feito em delphi q usa tbm a consulta do office e que quando digito o cep 89150-000 retorna os dados certinho. Estou nesse dilema a alguns dias de como fazer isso. Gostaria de fazer como você fez, mas precisaria ter certeza de q os dados estão atualizados... é legal usar o office? se os correios ficassem sabendo não haveria problemas será?

vlw
  • 0

#8 Orides Tomkiel Zmovirzynsk

Orides Tomkiel Zmovirzynsk
  • Membros
  • 125 posts

Postado 26 fevereiro 2007 - 16:46

Olá Iso, se te anima este código que eu passei ai usa exatamente o webservice que o office usa para acessar a página dos correios para coletar as informações, você tambem pode acessar a página em http://consultacep.c...Query.asmx?WSDL, se voce estudar um pouquinho sobre webservices vai enterder mais ou menos o que se passa nesse xml apresentado, bom mas como comentei ele usa a base dos correios atualizada, só que no caso da cidade de Presidente Getúlio - SC, ele tambem traz o resultado, pode conferir aqui , mas como o endereço não vem completo( rua : bairro : localidade : uf ) ele não apresenta o resultado, o que eu poderia fazer neste caso era adaptar o codigo, se caso ele viesse neste formato(somente nome da cidade e estado), para que não ficasse em branco depois de digitar o cep e sim apresentar estes dados.

Atenciosamente,

Orides Tomkiel Zmovirzynski
orides@midiaville.com.br
www.midiaville.com.br
  • 0

#9 Iso

Iso
  • Membros
  • 56 posts

Postado 26 fevereiro 2007 - 17:26

Se essa base do office é atualizada e é legal usar, acho q é a melhor forma. Senão teria q comprar a base de dados e tudo mais.

você poderia fazer essa alteração pra retornar a cidade e o estado? ou é muito complicado?
será q consigo fazer o inverso (trazer o cep, informado o endereço) me baseando no seu código?


estou iniciando em PHP, estou meia perdida ainda... os fóruns estão me ajudando bastante
você está me ajudando bastante, obrigado...
  • 0

#10 Rasp

Rasp

    the write less, do more!

  • Membros
  • 354 posts

Postado 27 fevereiro 2007 - 02:00

Sinceramente eu acho que seria interessante exibir os dados mesmo que incompletos, pois já ajuda bastante e como citado pela ISO, ficaria bem banaca o script funcionar ao inverso.
Não me arrisco a dar opinião de como fazer por enquanto mais em breve espero poder ajudar.

Abs
  • 1

#11 Orides Tomkiel Zmovirzynsk

Orides Tomkiel Zmovirzynsk
  • Membros
  • 125 posts

Postado 27 fevereiro 2007 - 08:00

Bom dia Pessoal,

Eu agora estou sem tempo para poder programar essas implementações, mas é possivel sim, e não é complicado, mas no momento estou fazendo uma atualização em meu site e estou com pouco tempo, mas eu já tenho uma aplicação que funciona da maneira que a ISO mencionou, que busca o endereço tanto pelo cep quanto pela rua, mas ela roda com os dados da minha base de dados, e não com a base do correio, pois o cadastro do meu site é específico da minha cidade, e teria que fazer algumas adptações para funcionar com os dados do correio, espero até o fim do mês de março poder fazer esta release do sistema para poder disponibilizar aqui no forum, enquanto isto se alguém estiver disposto a ajudar, toda a ajuda é bem vinda.

Att,

Orides Tomkiel Zmovirzynski
orides@midiaville.com.br
www.midiaville.com.br
  • 0

#12 Iso

Iso
  • Membros
  • 56 posts

Postado 27 fevereiro 2007 - 11:31

Legal Orides...
Vou tentar fazer assim q tiver algum tempinho livre, daí posto aqui pra ti analisares.

Estou gostando desse fórum, vou passar aqui todos os dias... hehe. No começo pra pedir ajuda, mas com o tempo espero poder compartilhar informações tbm.

brigada gente!!!
  • 0

#13 Rasp

Rasp

    the write less, do more!

  • Membros
  • 354 posts

Postado 28 fevereiro 2007 - 00:17

Orides achei muito bacana esse script seu e resolvi utiliza-lo em um projeto meu, porem adicionei outros campos, pois e um sistema de cadastro de clientes, e fiz algumas modificações como includes de css e de script.

Ate então ta tudo uma beleza funcionando perfeitamente, só que quando o cep digitado está errado ao invés do erro resultar na DIV que está do lado do input 'cep' ele resulta sempre no primeiro input que esta na lista, e não consegui achar o que pode estar dando esse erro.


Poderia me ajudar?
Vlw!!! Abraços. :thumbsup:/>

Editado por Mário Monteiro, 02 dezembro 2012 - 10:51 .

  • 0

#14 Iso

Iso
  • Membros
  • 56 posts

Postado 28 fevereiro 2007 - 08:16

Gente!!
Como eu havia dito quando um cep retornava somente o nome da cidade e estado, não estava aparecendo a informação na tela, arrumei o código, agora funciona.

Orides, talvez possa dar uma olhada se existe outra maneira de fazer. Fiz do jeito q achei mais fácil, alterei somente o form.php.
Eis o código:

<html>
  <head>
    <title>Busca Cep + Ajax + WebService Correio</title>
    <script type="text/javascript">
function addEvent(obj, evt, func) {
  if (obj.attachEvent ) {
    return obj.attachEvent(("on"+evt), func);
  } else if (obj.addEventListener) {
    obj.addEventListener(evt, func, true);
    return true;
  }
  return false;
}
function XMLHTTPRequest() { 
  try {
    return new XMLHttpRequest(); // FF, Safari, Konqueror, Opera, ...
  } catch(ee) {
    try {
      return new ActiveXObject("Msxml2.XMLHTTP"); // activeX (IE5.5+/MSXML2+)
    } catch(e) { 
      try {
        return new ActiveXObject("Microsoft.XMLHTTP"); // activeX (IE5+/MSXML1)
      } catch(E) {
        return false; // doesn't support
      }
    }
  }
}
function buscarEndereco() { 
var campos = {
  validcep: document.getElementById("validcep"),
  cep: document.getElementById("cep"),
  logradouro: document.getElementById("logradouro"),
  numero: document.getElementById ("numero"),
  bairro: document.getElementById("bairro"),
  localidade: document.getElementById("localidade"),
  uf: document.getElementById("uf")
};
var ajax = XMLHTTPRequest(); 
ajax.open("GET", ("./webservice.php?cep=" + campos.cep.value.replace(/[^\d]*/, "")), true);
  ajax.onreadystatechange = function() {
  if (ajax.readyState == 1) {
  campos.logradouro.disabled = true;
  campos.logradouro.value = "carregando...";
  campos.bairro.disabled = true;
  campos.localidade.disabled = true;
  campos.bairro.value = "carregando...";
  campos.uf.disabled = true; 
  campos.localidade.value = "carregando...";
  } else if (ajax.readyState == 4) {
  if(ajax.responseText == false){
    campos.validcep.innerHTML = "<b>Cep invalido !</b>";
    campos.logradouro.disabled = false;
    campos.logradouro.value = "";
    campos.bairro.disabled = false;
    campos.localidade.disabled = false;
    campos.bairro.value = "";
    campos.uf.disabled = false;
    campos.localidade.value = "";
  }else{
    campos.validcep.innerHTML = "";
    var r = ajax.responseText, i, logradouro, numero, bairro, localidade, uf;
 
    logradouro = r.substring(0, (i = r.indexOf(':')));
    campos.logradouro.disabled = false;
    campos.logradouro.value = unescape(logradouro.replace(/\+/g," "));
    r = r.substring(++i);
    bairro = r.substring (0, (i = r.indexOf(':')));
    campos.bairro.disabled = false;
    campos.bairro.value = unescape(bairro.replace(/\+/g," "));
    r = r.substring(++i);
 
    if (r.indexOf('<cidade>') > 0){ 
       localidade = r.substring(r.indexOf('<cidade>') + 8, r.indexOf(' - '));
       r = r.substring(++i);
       uf = r.substring(r.indexOf(' - ') + 3, r.indexOf('</cidade>')); 
    }   
    else{  
       localidade = r.substring(0, (i = r.indexOf(':')));
       r = r.substring(++i);
       uf = r.substring(0, (i = r.indexOf(';')));
    }

    campos.localidade.disabled = false;
    campos.localidade.value = unescape(localidade.replace(/\+/g," "));
    campos.uf.disabled = false;
    i = campos.uf.options.length;
    while (i--) {
      if (campos.uf.options[i].getAttribute("value") == uf) {
      break;
      }
    }
    campos.uf.selectedIndex = i;
  }
  }
};
ajax.send(null);
}
window.addEvent(
  window, 
  "load",
  function() {window.addEvent(document.getElementById("cep"), "blur", buscarEndereco);}
);
</script>
<style type"text/css">

body {
  margin: 0;
  padding: 30px 50px;
  font: 70% Verdana, Arial, sans-serif;
}
h1 {font-size: 140%;}
form {margin: 30px 50px 0;}
form fieldset {
  float: left;
  padding: 0 20px 10px;
  background: #e5e5e5;
  border-style: solid;
  border-width: 1px 2px 2px 1px;
  border-color: #AAA;
}
form legend {
  margin-bottom: 15px;
  padding: 5px 10px;
  background: #F5F5F5;
  border-style: solid; 
  border-width: 1px 2px 2px 1px;
  border-color: #AAA;
  font-weight: bold;
}
form p {
  float: left;
  clear: both;
  margin: 0;
}
form label {
  float: left;
  clear: left;
  display: block; 
  width: 90px;
  height: 30px;
  margin-right: 5px;
  padding-top: 3px;
  cursor: pointer;
  text-align: right;
  color: #C00;
}
form label.numero {clear: none; width: 60px;}
form label.uf {clear: none; width: 30px;} 
form input {float: left; width: 200px;}
form input#numero, form input#uf {width: 50px;}
form input#bt-submit {width: 100px; margin-left: 150px;}
address {clear: both; padding: 30px 0;}
    </style>
  </head>
  <body>
    <form action="#" method="post" name="pai">
      <fieldset>
        <legend>Informe o Cep</legend>
        <p>
          <label for="cep">CEP</label>
      <input type="text" name="cep" id="cep" onKeyDown="if(event.keyCode==13) event.keyCode=9;" />
  <div id="validcep" style="color: #FF0000;"></div> 
         </p>
        <p>
          <label for="logradouro">Logradouro</label>
          <input name="logradouro" type="text" id="logradouro" onKeyDown="if( event.keyCode==13) event.keyCode=9;" />
          <label for="numero" class="numero">N&uacute;mero</label>
          <input type="text" name="numero" id="numero" onKeyDown="if( event.keyCode==13) event.keyCode=9;" />
        </p>
      <p>
          <label for="complemento">Complemento</label>
          <input type="text" name="complemento" id="complemento" onKeyDown="if( event.keyCode==13) event.keyCode=9;" />
      </p>
        <p>
          <label for="bairro">Bairro</label>
          <input type="text" name="bairro" id="bairro" onKeyDown="if( event.keyCode==13) event.keyCode=9;" />
        </p>
        <p>
          <label for="localidade">Localidade</label>
          <input type="text" name="localidade" id="localidade" onKeyDown="if( event.keyCode==13) event.keyCode=9;" />
          <label for="uf" class="uf">UF</label>
          <select id="uf">
            <option value="">-- selecione --</option> 
            <option value="AC">Acre</option>
            <option value="AL">Alagoas</option>
            <option value="AP">Amap&aacute;</option> 
            <option value="AM">Amazonas</option>
            <option value="BA">Bahia</option>
            <option value="CE">Cear&aacute;</option> 
            <option value="DF">Distrito Federal</option>
            <option value="ES">Esp&iacute;rito Santo</option>
            <option value="GO">Goi&aacute;s</option> 
            <option value="MA">Maranh&atilde;o</option>
            <option value="MT">Mato Grosso</option>
            <option value="MS">Mato Grosso do Sul</option> 
            <option value="MG">Minas Gerais</option>
            <option value="PA">Par&aacute;</option>
            <option value="PB">Para&iacute;ba</option> 
            <option value="PR">Paran&aacute;</option>
            <option value="PE">Pernambuco</option>
            <option value="PI">Piau&iacute;</option> 
            <option value="RJ">Rio de Janeiro</option>
            <option value="RN">Rio Grande do Norte</option>
            <option value="RS">Rio Grande do Sul</option> 
            <option value="RO">Rond&ocirc;nia</option>
            <option value="RR">Roraima</option>
            <option value="SC">Santa Catarina</option> 
            <option value="SP">S&atilde;o Paulo</option>
            <option value="SE">Sergipe</option>
            <option value="TO">Tocantins</option> 
          </select>
        </p>
        <p>
          <input type="submit" id="bt-submit" value="Enviar" />
        </p>
      </fieldset> 
    </form>
  </body>
</html>

Editado por Periscuelo, 13 outubro 2011 - 13:01 .
Inserir o código dentro de code para melhor visualização do tópico

  • 0

#15 Orides Tomkiel Zmovirzynsk

Orides Tomkiel Zmovirzynsk
  • Membros
  • 125 posts

Postado 28 fevereiro 2007 - 09:07

Olá a todos,

Obrigado ISO por ajudar, ficou legal, meus parabéns, quanto ao problema do Rasp eu fiz o seguinte, nas propriedades da div validcep, eu coloquei um padding-top com o valor de 40px no meu caso para ele apresentar a resposta na altura do input do cep, ai voce pode alterar conforme o seu formulário, se alguém tiver mais alguma sugestão ou alteração para contribuir com o código fica ai o convite:


<div id="validcep" style="color:ff0000; padding-top:40px;"></div>

Obs: Todas estas alterações citadas acima já estão atualizadas tanto na página para visualização quanto no arquivo para download.

Att,

Orides Tomkiel Zmovirzynski
orides@midiaville.com.br
www.midiaville.com.br
  • 0

#16 Rasp

Rasp

    the write less, do more!

  • Membros
  • 354 posts

Postado 28 fevereiro 2007 - 16:51

Opa Orides,
Valeu pela ajuda, incluse alinhei a div direitinho. Aproveitando eu fiz uma alteração não signifcativa pra sistema e tal, mais sim para os padrões de Usuabilidade, é que o resultado da div era dado em negrito sendo utlizado <b></b>, só que para alguem que queira utilizar o padrão W3C isso não vai passar então alterei para <strong></strong> que é o padrão utilizado atualmente.

Segue o codigo:

}
}
}
}
function buscarEndereco() {
var campos = {
validcep _linenums:0'><html><head><title>Busca Cep + Ajax + WebService Correio</title><script type="text/javascript">function addEvent(obj, evt, func) {if (obj.attachEvent ) {return obj.attachEvent(("on"+evt), func);} else if (obj.addEventListener) {obj.addEventListener(evt, func, true);return true;}return false;}function XMLHTTPRequest() {try {return new XMLHttpRequest(); // FF, Safari, Konqueror, Opera, ...} catch(ee) {try {return new ActiveXObject("Msxml2.XMLHTTP"); // activeX (IE5.5+/MSXML2+)} catch(e) {try {return new ActiveXObject("Microsoft.XMLHTTP"); // activeX (IE5+/MSXML1)} catch(E) {return false; // doesn't support}}}}function buscarEndereco() {var campos = {validcep: document.getElementById("validcep"),cep: document.getElementById("cep"),logradouro: document.getElementById("logradouro"),numero: document.getElementById ("numero"),bairro: document.getElementById("bairro"),localidade: document.getElementById("localidade"),uf: document.getElementById("uf")};var ajax = XMLHTTPRequest();ajax.open("GET", ("./webservice.php?cep=" + campos.cep.value.replace(/[^\d]*/, "")), true);ajax.onreadystatechange = function() {if (ajax.readyState == 1) {campos.logradouro.disabled = true;campos.logradouro.value = "carregando...";campos.bairro.disabled = true;campos.localidade.disabled = true;campos.bairro.value = "carregando...";campos.uf.disabled = true;campos.localidade.value = "carregando...";} else if (ajax.readyState == 4) {if(ajax.responseText == false){campos.validcep.innerHTML = "<strong>Cep invalido !</strong>";campos.logradouro.disabled = false;campos.logradouro.value = "";campos.bairro.disabled = false;campos.localidade.disabled = false;campos.bairro.value = "";campos.uf.disabled = false;campos.localidade.value = "";}else{campos.validcep.innerHTML = "";var r = ajax.responseText, i, logradouro, numero, bairro, localidade, uf;logradouro = r.substring(0, (i = r.indexOf(':')));campos.logradouro.disabled = false;campos.logradouro.value = unescape(logradouro.replace(/\+/g," "));r = r.substring(++i);bairro = r.substring (0, (i = r.indexOf(':')));campos.bairro.disabled = false;campos.bairro.value = unescape(bairro.replace(/\+/g," "));r = r.substring(++i);/*if (r.indexOf('<cidade>') > 0){localidade = r.substring(r.indexOf('<cidade>') + 8, r.indexOf(' - '));r = r.substring(++i);uf = r.substring(r.indexOf(' - ') + 3, r.indexOf('</cidade>'));}else{localidade = r.substring(0, (i = r.indexOf(':')));r = r.substring(++i);uf = r.substring(0, (i = r.indexOf(';')));}*/campos.localidade.disabled = false;campos.localidade.value = unescape(localidade.replace(/\+/g," "));campos.uf.disabled = false;i = campos.uf.options.length;while (i--) {if (campos.uf.options[i].getAttribute("value") == uf) {break;}}campos.uf.selectedIndex = i;}}};ajax.send(null);}window.addEvent(window,"load",function() {window.addEvent(document.getElementById("cep"), "blur", buscarEndereco);});</script><style type"text/css">body {margin: 0;padding: 30px 50px;font: 70% Verdana, Arial, sans-serif;}h1 {font-size: 140%;}form {margin: 30px 50px 0;}form fieldset {float: left;padding: 0 20px 10px;background: #e5e5e5;border-style: solid;border-width: 1px 2px 2px 1px;border-color: #AAA;}form legend {margin-bottom: 15px;padding: 5px 10px;background: #F5F5F5;border-style: solid;border-width: 1px 2px 2px 1px;border-color: #AAA;font-weight: bold;}form p {float: left;clear: both;margin: 0;}form label {float: left;clear: left;display: block;width: 90px;height: 30px;margin-right: 5px;padding-top: 3px;cursor: pointer;text-align: right;color: #C00;}form label.numero {clear: none; width: 60px;}form label.uf {clear: none; width: 30px;}form input {float: left; width: 200px;}form input#numero, form input#uf {width: 50px;}form input#bt-submit {width: 100px; margin-left: 150px;}address {clear: both; padding: 30px 0;}</style></head><body><form action="#" method="post" name="pai"><fieldset><legend>Informe o Cep</legend><p><label for="cep">CEP</label><input type="text" name="cep" id="cep" onKeyDown="if(event.keyCode==13) event.keyCode=9;" /><div id="validcep" style="color: #FF0000; padding-top: 4px; padding-left: 300px;"></div></p><p><label for="logradouro">Logradouro</label><input name="logradouro" type="text" id="logradouro" onKeyDown="if( event.keyCode==13) event.keyCode=9;" /><label for="numero" class="numero">N&uacute;mero</label><input type="text" name="numero" id="numero" onKeyDown="if( event.keyCode==13) event.keyCode=9;" /></p><p><label for="complemento">Complemento</label><input type="text" name="complemento" id="complemento" onKeyDown="if( event.keyCode==13) event.keyCode=9;" /></p><p><label for="bairro">Bairro</label><input type="text" name="bairro" id="bairro" onKeyDown="if( event.keyCode==13) event.keyCode=9;" /></p><p><label for="localidade">Localidade</label><input type="text" name="localidade" id="localidade" onKeyDown="if( event.keyCode==13) event.keyCode=9;" /><label for="uf" class="uf">UF</label><select id="uf"><option value="">-- selecione --</option><option value="AC">Acre</option><option value="AL">Alagoas</option><option value="AP">Amap&aacute;</option><option value="AM">Amazonas</option><option value="BA">Bahia</option><option value="CE">Cear&aacute;</option><option value="DF">Distrito Federal</option><option value="ES">Esp&iacute;rito Santo</option><option value="GO">Goi&aacute;s</option><option value="MA">Maranh&atilde;o</option><option value="MT">Mato Grosso</option><option value="MS">Mato Grosso do Sul</option><option value="MG">Minas Gerais</option><option value="PA">Par&aacute;</option><option value="PB">Para&iacute;ba</option><option value="PR">Paran&aacute;</option><option value="PE">Pernambuco</option><option value="PI">Piau&iacute;</option><option value="RJ">Rio de Janeiro</option><option value="RN">Rio Grande do Norte</option><option value="RS">Rio Grande do Sul</option><option value="RO">Rond&ocirc;nia</option><option value="RR">Roraima</option><option value="SC">Santa Catarina</option><option value="SP">S&atilde;o Paulo</option><option value="SE">Sergipe</option><option value="TO">Tocantins</option></select></p><p><input type="submit" id="bt-submit" value="Enviar" /></p></fieldset></form></body></html>




Aproveitando ISO ou ORIDES eu encontrei um pequeno erro na alteração que a ISO fez, não sei se é somente no meu micro mais esta apresentando tanto no IE quanto no FF, e no input 'localidade' quando você insere e apaga o cep ele esta resultando infos do script.
Espero ter ajudado com alguma coisa =)

Absss.
  • 0

#17 Iso

Iso
  • Membros
  • 56 posts

Postado 28 fevereiro 2007 - 16:56

puxa gente, eu tô a um mês mexendo com php/javascript, e ajax nunca tinha mexido, tinha q dar erro com certeza né...hehe
se alguém puder corrigir e postar agradeço...

té mais
  • 0

#18 Rasp

Rasp

    the write less, do more!

  • Membros
  • 354 posts

Postado 28 fevereiro 2007 - 17:00

Pô ISO relaxa.. hehe..
informei mesmo so pra gente tentar resolver... e se quise pode pegar essa alteração que eu fiz dentro do padrão W3C

Assim que tiver um tempo legal eu vejo pra resolver isso.

Abs


OBS: estou vendo pra fazer o inverso da consulta, digitando o endereço pelo menos localidade e UF, ter a informação do CEP.
  • 0

#19 Iso

Iso
  • Membros
  • 56 posts

Postado 28 fevereiro 2007 - 17:28

legal Rasp, se você fizer o inverso da consulta posta aí pra gente
vlw
  • 0

#20 nb-master

nb-master

    Nb-Master

  • Membros
  • 370 posts

Postado 28 fevereiro 2007 - 17:31

Ae meus parabens para quem monto o COD fico mt mass...


flw..
  • 0




Publicidade

/ins>