0

td bem?

Tenho um script em PHP que converte o CEP em Coordenada e gostaria que ele convertesse automaticamente de acordo com o valor de um input.

<input type="text" value="" id="cep" >
<input type="text" value="" id="latitude">
<input type="text" value="" id="longitude">
<?php
    $cep = '01311-100';
    $geocode = file_get_contents('http://maps.google.com/maps/api/geocode/json?address='.$cep.'&sensor=false');
    $output= json_decode($geocode);
    $lat = $output->results[0]->geometry->location->lat;
    $long = $output->results[0]->geometry->location->lng;
    echo $lat;
    echo $long;
    ?>

Nesse acima ele transforma o cep do $cep em coordenada, mas queria que ao inserir o cep no input ele já convertesse e colocasse a latitude e longitude nos inputs correspondentes.

Esses valores serão inseridos em uma tabela mysql.

Obrigado!

4
  • Nesse caso você vai ter que fazer um ajax pra obter os dados de acordo com o novo cep Commented 2/06/2017 às 19:19
  • Desculpa, sou iniciante o ajax enviaria o valor do input para variavel do php? Commented 2/06/2017 às 19:31
  • Não, o ajax fará uma requisição para: http://maps.google.com/maps/api/geocode/json?address=CEP, onde CEP é o cep digitado no input, a resposta do ajax virá com as informações que você precisa. Commented 2/06/2017 às 19:34
  • Ou se não permitir, pra um script php, que faça essa requisição e retorne a resposta Commented 2/06/2017 às 19:42

1 Resposta 1

1

Fazendo requisição ajax pra obter a latitude e longitude do CEP dinamicamente:

$('#cep').keyup(function() { // Dispara a função quando um caracter é digitado
  if(this.value.length > 7) { // Checa se o campo cep tem mais de 7 caracteres
    
    // Requisição ajax.
    var request = $.ajax({
      url: "https://maps.google.com/maps/api/geocode/json?address=21331009",
      method: "GET",
      dataType: 'json'
    });
    
    // Executa caso tenha sucesso na requisição.
    request.done(function( response ) {
      let location = response.results[0].geometry.location; // Obtém os valores de latitude e longitude
      
      // Muda adiciona os valores nos campos correspondentes
      $('#latitude').val(location.lat);
      $('#longitude').val(location.lng);
    });

    // Executa caso a requisição falhe.
    request.fail(function() {
      alert('Erro');
    });
  } else { // Limpa latitude e longitude caso o cep esteja incompleto
    $('#latitude').val('');
    $('#longitude').val('');
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value="" id="cep" maxlength="8" placeholder="Digite o CEP aqui...">
<input type="text" value="" id="latitude" readonly>
<input type="text" value="" id="longitude" readonly>

1
  • Obrigado, deu certinho! Commented 2/06/2017 às 20:36

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .