Ayuda pasar datos de javascript a php

pa3lo022 · 29 Jun 2016

Hola a todos, la verdad que me estoy volviendo loco, no puedo pasar datos de javascript a php. Estoy utilizando la api de google map echa en php, y quiero pasar la longintud y latitud a php pero no puedo, logre pasarla por url pero no quiero que se vea en la url, alguien me puede ayudar?

Les paso el codigo

HTML:

<!DOCTYPE html>
<html>
<head>
	<title>Posicionamiento con HTML 5 y Google Maps</title>
	<meta charset="UTF-8" />
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<link href='http://fonts.googleapis.com/css?family=Marcellus' rel='stylesheet' type='text/css'>	
	<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
	<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=true"></script>
	<style>
	
	* { margin: 0; padding: 0; }
	html { height: 100%; }
	body { background-image: url(images/old_map.png); font-size: 16px; font-family: 'Marcellus', serif; height: 100%; position: relative; }
	header { background-color: rgba(0,0,0,.88); height: 80px; width: 100%; position: fixed; z-index: 99; box-shadow: 0px 2px 3px #333333; }
	header > h1 { color: #FFFFFF; font-family: 'Marcellus', serif; font-size: 1.2em; font-weight: normal; margin: 30px 60px; }
	
	#mapa { position: absolute; background: transparent; height: 50%; width: 50%; top: 1000; left: 0; right: 0; bottom: 0; }
	#informacion { position: absolute; background: rgba(0,16,27,.85); z-index: 200; top: 70%; width: 30%; padding: 12px; }
	
	#informacion h2,
	#informacion h3 { color: #FFFFFF; text-shadow: 1px 1px 1px #000000; font-weight: normal; font-size: .9em; }
	
	#informacion h2 { font-size: 1.1em; margin-bottom: 10px; }
	
	#informacion h3 span { color: #FF5555; }
	
	</style>
	<script type="text/javascript">
	
	function informacion (coordenadas) {
		$("#latitude").html(coordenadas.Lat);
		$("#longitude").html(coordenadas.Lng);
	}
	
	function iniciar() {
		
		var coordenadas = {
			Lat: 0,
			Lng: 0
		};
		
		function localizacion (posicion) {
			coordenadas = {
				Lat: posicion.coords.latitude,
				Lng: posicion.coords.longitude                              
			}
			
			informacion(coordenadas);
			
			var mapOptions = {
				zoom: 16,
				center: new google.maps.LatLng(coordenadas.Lat, coordenadas.Lng),
				disableDefaultUI: true,
				mapTypeId: google.maps.MapTypeId.ROADMAP
			}
			
			var map = new google.maps.Map(document.getElementById('mapa'), mapOptions);
			
			var infowindow = new google.maps.InfoWindow({
				map: map,
				position: new google.maps.LatLng(coordenadas.Lat, coordenadas.Lng),
				content: '<?php echo $_SESSION['Name'] ?>'
            });
		}
		
		function errores (error) {
			alert('Ha ocurrido un error al intentar obtener la información');
		}
		
		if (navigator.geolocation) {
			navigator.geolocation.watchPosition(localizacion,errores);
		} else {
			alert("Tu navegador no soporta o no tiene habilitada la 'Geolocalización'");
		}
		
	}
	</script>
</head>
<body onload="iniciar()">

	<div id="informacion"> 
		<h2>Tu posición actual es:</h2>
		<h3>Latitud: <span id="latitude"></span></h3>
		<h3>Longitud: <span id="longitude"></span></h3>
	</div>
	<div id="mapa"></div>
</body>
</html>

muchas gracias

Noname · 29 Jun 2016

De php a js es mas sencillo, de js a php se complica un poco. Deberias pasar los datos por post a otro archivo .php que los recoja y mostrarlos con ajax para refrescar el contenido sin refrescar la pagina completa.

darkdraco · 29 Jun 2016

para empezar, si quieres enviar datos a php puedes utilizar un form para enviar los datos y los recoges en php, investiga sobre los forms de html la verdad es demasiado sencillo lo que quieres pero necesitas estudiarlo tu :encouragement:

pa3lo022 · 29 Jun 2016

Con form? dentro de javascript? lo voy a investigar gracias.

Cicklow · 29 Jun 2016

pa3lo022 dijo:
Con form? dentro de javascript? lo voy a investigar gracias.

pero los datos que quieres pasar a php los vas a usar para algo?... o simplemente se lo envias y no haces mas nada (da igual que haga el php con esos datos)...

O sea...
1- pasas los datos al php, y este hace algo con estos datos conjuntamente con maps...
2- pasas los datos y los guardas o lo que sea...

puedes ser mas especifico...?¿

Por que si solo necesitas pasar los datos puedes usar

HTML:

<script>
var fileref=document.createElement('script');
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", "archivo.php?lat="+lat+"long="+long);
if (typeof fileref!="undefined") document.getElementsByTagName("head")[0].appendChild(fileref)
</script>

o con createelement iframe... hay muchas opciones... pero todo depende de que necesites...

pa3lo022 · 29 Jun 2016

Claro cuando tengo los datos los guardo en una base de datos

Cicklow · 29 Jun 2016

pa3lo022 dijo:
Claro cuando tengo los datos los guardo en una base de datos

pues puedes usar createElement con un js/iframe, con ajax...

victory · 29 Jun 2016

como dijo clicklow, lo mejor es con llamadas Ajax.

pa3lo022 · 1 Jul 2016

victory dijo:
como dijo clicklow, lo mejor es con llamadas Ajax.

entonces me tendre que poner a estudiar ajax :ambivalence:

tengo este codigo:

HTML:

<?php
include 'conexion.php';
?>
<!DOCTYPE html>
<html>
  <head>
    <title>Geolocation</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
      #map {
        height: 50%;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
// Note: This example requires that you consent to location sharing when
// prompted by your browser. If you see the error "The Geolocation service
// failed.", it means you probably did not give permission for the browser to
// locate you.

function initMap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 16
  });
  var infoWindow = new google.maps.InfoWindow({map: map});

  // Try HTML5 geolocation.
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var pos = {
        lat: position.coords.latitude,
        lng: position.coords.longitude
      };

      infoWindow.setPosition(pos);
      infoWindow.setContent('Pablo');
      map.setCenter(pos);
      latitud = position.coords.latitude;
      <?php 
      $latitudPHP = "<script>document.writeln(latitud)</script>";
      ?>
    }, function() {
      handleLocationError(true, infoWindow, map.getCenter());
    });
  } else {
    // Browser doesn't support Geolocation
    handleLocationError(false, infoWindow, map.getCenter());
  }
}
function handleLocationError(browserHasGeolocation, infoWindow, pos) {
  infoWindow.setPosition(pos);
  infoWindow.setContent(browserHasGeolocation ?
                        'Error: The Geolocation service failed.' :
                        'Error: Your browser doesn\'t support geolocation.');
}
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=dWJhSVdaWJhSVsd43trWJhSVerFu-zkq-Mh0V_1I&signed_in=true&callback=initMap"
        async defer>
    </script>
    <?php
    echo 'latitud: ' . $latitudPHP;
    ?>
  </body>
</html>

y en la parte de $latitudPHP = "<script>document.writeln(latitud)</script>"; ahi no guarda nada en la variable php, en todos lados dice que asi se pasa una variable desde js a php, pero en este caso no me pasa nada.

La verdad que ya no se donde investigar.

Gracias a todos

Jonaa · 1 Jul 2016

Buenas! generalmente los paso via ajax ya que javascript se ejecuta en el cliente y phph en el.servidor, si necesitas puedo ayudarte, enviame un mp y te puedo pasar algun ejemplo. Saludos

Ayuda pasar datos de javascript a php

pa3lo022

Noname

darkdraco

pa3lo022

Cicklow

pa3lo022

Cicklow

victory

pa3lo022

Jonaa

Temas similares