HTML - Pasar valor HTML <span> a PHP

 
Vista:
sin imagen de perfil
Val: 5
Ha aumentado su posición en 21 puestos en HTML (en relación al último mes)
Gráfica de HTML

Pasar valor HTML <span> a PHP

Publicado por john (1 intervención) el 30/10/2020 19:19:19
Tengo 1 archivo HTML, 1 JS y necesito pasar a PHP las 2 valores recogidos latitud y longitud (obtenidos con una función de localización que encontré en internet )

Pondré solo la parte pertinente del código
HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<div class="col-sm-12">
   <div class="col-sm-3">
      <div class="form-group">
         Latitud:
         <span  id="latitud" name="latitud" ></span>
       <!--  <input type="hidden" id="latitud" name="latitud">
         <input class="form-control" type="text" id= "latitud" name="latitud" value="" autocomplete="off"/>-->
 
      </div>
   </div>
   <div class="col-sm-3">
      <div class="form-group">
         Longitud:
         <span  id="longitud" name="longitud" ></span>
      <!--   <input type="hidden" id="latitud" name="latitud">
         <input class="form-control" type="text" id="longitud" name="longitud" value="" autocomplete="off"/>-->
 
 
      </div>
 
 
   </div>
   <div class="col-sm-3">
      <div class="form-group" >
         <button type="button" class="button pull-left glyphicon glyphicon-map-marker" onclick="initiate_geolocation();">&nbsp;Capturar Ubicación</button>
 
      </div>
   </div>

JAVASCRIPT

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
function initiate_geolocation() {
  if (navigator.geolocation) {
    browserSupportFlag = true;
    var watchId = navigator.geolocation.getCurrentPosition(successCallback, errorCallback, PositionOptions);
  } else {
    document.getElementById("mensaje").innerHTML = "Lo sentimos pero el API de Geolocalización de HTM5 no está disponible para su navegador";
  }
}
 
function successCallback(pos) {
 
  var timestamp = document.getElementById('timestamp');
  var date = new Date(pos.timestamp);
  var mes = date.getMonth() + 1;
  if (mes < 10) {
    mes = "0" + mes
  }
  var dia = date.getDate();
  if (dia < 10) {
    dia = "0" + dia
  }
  var anyo = date.getFullYear();
  var hora = date.getHours();
  if (hora < 10) {
    hora = "0" + hora
  }
  var minuto = date.getMinutes();
  if (minuto < 10) {
    minuto = "0" + minuto
  }
  var segundo = date.getSeconds();
  if (segundo < 10) {
    segundo = "0" + segundo
  }
 
  var latitud = document.getElementById('latitud');
  latitud.innerHTML = pos.coords.latitude.toFixed(6);  // Limito decimales de coordenadas a 6
 
  var longitud = document.getElementById('longitud');
    longitud.innerHTML = pos.coords.longitude.toFixed(6);
 
};
 
 
 $(document).ready(function() {
    $.ajax({
      type: 'post',
      url: 'ventas_cliente.php',
      data: ({longitud:longitud, latitud:latitud}),
      success: function( data ) {
         document.write( data );
        }
      });
      console.log(data.get('longitud'));
});

PHP

1
$lon = $_POST['longitud'];    Pero no funciona por que esto esta en HTML dentro de una etiqueta <span>

Soy muy nuevo en el tema asi que por favor mil disculpas por los inmensos errores que pueda tener y gracias por su ayuda
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
1
Responder

Pasar valor HTML <span> a PHP

Publicado por Martha (137 intervenciones) el 02/11/2020 11:30:03
John,

La etiqueta <span> solo sirve para dar formato a una línea de texto, justo lo que va entre la etiqueta de apertura y de cierre.

En tu código no hay nada.

Para rocoger valores, necesitas un campo input.

Si no quieres que el usuario lo vea, le puedes dar un tipo hidden. Si necesitas que el usuario introduzca datos, el tipo debe ser diferente a hidden.

Un input type="hidden" tiene que recibir su contenido en el atributo value. Value puede ser algo fijo y ya establecido, o el producto de una fórmula o función.

Pero lo que estoy viendo en tu código es que tienes comentados los campos input con <!-- y -->, con esto le estas diciendo que se olvide de ellos y no los use.

Mas cosas.

En el JavaScript estás usando

1
document.getElementById.

No puedes tener más de un elemento con el mismo Id.

Así es que yo comentaría las etiquetas span y el input type hidden, tal y como te muestro:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div class="col-sm-3">
 
      <div class="form-group">
 
         Longitud:
<!--
         <span  id="longitud" name="longitud" ></span>
         <input type="hidden" id="latitud" name="latitud">
-->
         <input class="form-control" type="text" id="longitud" name="longitud" value="" autocomplete="off"/>
 
      </div>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar