[SOLUCIONADO] Seleccionar coordenadas google maps y guardarlas en BD

educito_94 · #1 (**permalink**) 14/11/2014, 14:56

Tengo este ejemplo que encontre en la red :

Código HTML:

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<style type="text/css"> 
  html { height: 100% } 
  body { height: 100%; margin: 0px; padding: 0px } 
  #map_canvas { height: 100% } 
</style> 
<script type="text/javascript" 
    src="https://maps.google.com/maps/api/js?sensor=false"> 

</script> 
   
<script type="text/javascript">
    function obtCoor(marker) {
        document.getElementById("loglat").innerHTML = 'Latitud: ' + marker.getPosition().lat();
        document.getElementById("loglong").innerHTML = 'Longitud: ' + marker.getPosition().lng();
    }
    function initialize() {
        var myLatlng = new google.maps.LatLng(-11.67840, -76.39702);
        var myOptions = {
            zoom: 10,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
        }
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        marker = new google.maps.Marker({
            position: myLatlng,
            draggable: true,
            title: "Hello World!"
        });
        google.maps.event.addListener(marker, "dragend", function () {
            obtCoor(marker);
        });

        marker.setMap(map);
        obtCoor(marker);


    }



</script> 
</head> 
<body onload="initialize()"> 
   
<div id="map_canvas" style="width: 700px; height: 450px;"></div><br> 
<font color="#0000FF"><strong id="loglat">Latitud:</strong></font>  

<br> 
<font color="#FF0000"><strong id="loglong">Longitud:</strong></font>  

</body> 
</html>

Lo que hace ese ejemplo es arrastrar el marcador y actualizar la lng y lat.
Ahora mi duda es como podria hacer para que esas coordenadas se guarden en una BD ??
No quiero que se agregue mas codigo al html, solo q esas corrdenadas se guarden en una BD .
Saludos .. ojala me puedan ayudar es urgenteeeee

#2 (**permalink**) 15/11/2014, 10:22

Hola educito_94:

Dices que "No quiero que se agregue mas codigo al html, solo q esas corrdenadas se guarden en una BD"

Lo más sencillo que se me ocurre es que crees un form (oculto) con un button que te permita elegir cuándo y qué coordenadas guardar.

Lo difícil lo tienes: lo más fácil sería enviar los datos a una base previamente creada y guardarlos.

V. Gr.:

Código HTML:

Ver original<form method="post" id="datos" name="datos">
          <input type="hidden" id="latitud" name="latitud">
          <input type="hidden" id="longitud" name="longitud">
          <input type="submit" id="enviar" name="enviar" value="Enviar/guardar datos">
          </div>
     </form>

y en tu Javascript:

Código Javascript:

Ver originalfunction obtCoor(marker) {
        // ... //
        document.getElementById("latitud").value = marker.getPosition().lat();
        document.getElementById("longitud").value = marker.getPosition().lng();
    }

Y, claro está, guardar los datos del form en tu base de datos.

educito_94 · #3 (**permalink**) 17/11/2014, 15:14

si eso me funciono gracias !!