Foros del Web » Programando para Internet » Javascript »

Colocar los valores numéricos de geolocalización dentro de campos en formulario HTML

Estas en el tema de Colocar los valores numéricos de geolocalización dentro de campos en formulario HTML en el foro de Javascript en Foros del Web. Place geolocation numerical values ​​within fields in an HTML form The website is located with a marker position and shows the coordinate data within a ...
  #1 (permalink)  
Antiguo 27/09/2012, 11:09
Avatar de akpshiva  
Fecha de Ingreso: septiembre-2012
Mensajes: 16
Antigüedad: 11 años, 6 meses
Puntos: 0
Exclamación Colocar los valores numéricos de geolocalización dentro de campos en formulario HTML

Place geolocation numerical values ​​within fields in an HTML form

The website is located with a marker position and shows the coordinate data within a DIV, however I need the numerical values ​​of latitude and longitude are loaded into the HTML form fields to be subsequently stored in MySQL data base, as I can load the values ​​in the respective fields of latitude and longitude.

En la pagina web se ubica con un marcador la posicion y se muestran los datos de las coordenadas dentro de un DIV, sin embargo necesito que los valores numéricos de latitud y longitud sean cargados dentro de los campos de un formulario HTML para ser posteriormente guardados en una base datos MySQL, como puedo cargar los valores dentro los respectivos campos de latitud y longitud.

Esta es la URL del ejemplo / This is the URL: http://www.colombiainteligente.com/geolocalizacion/demo.php

This is the code / Este es el codigo fuente

Código HTML:
<head>
<meta name = "viewport" content = "width = device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;">		
<script src="js/gears_init.js" type="text/javascript" charset="utf-8"></script>
<script src="js/geo.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

<script>
    function initialize_map()
    {
    var myOptions = {
	      zoom: 15,
	      mapTypeControl: true,
	      mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
	      navigationControl: true,
	      navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
	      mapTypeId: google.maps.MapTypeId.ROADMAP      
	    }	
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    }
    function initialize()
    {
	if(geo_position_js.init())
	{
		document.getElementById('current').innerHTML="Recibiendo Información...";
		geo_position_js.getCurrentPosition(show_position,function(){document.getElementById('current').innerHTML="No puede ubicar posición"},{enableHighAccuracy:true});
	}
	else
	{
		document.getElementById('current').innerHTML="Funcionalidad no disponible";
	}
    }

    function show_position(p)
    {
	document.getElementById('current').innerHTML="Latitud= "+p.coords.latitude.toFixed(2)+" Longitud= "+p.coords.longitude.toFixed(2);
		
	var pos=new google.maps.LatLng(p.coords.latitude,p.coords.longitude);
	map.setCenter(pos);
	map.setZoom(16);
    
	var infowindow = new google.maps.InfoWindow({
	    content: "<table>" +
		         "<tr><td>Ubicación Encontrada</td></tr>" 
                 
	});

	var marker = new google.maps.Marker({
	position: pos,
	map: map,
	title:"Usted está Aquí"
	});

	google.maps.event.addListener(marker, 'click', function() {
	  infowindow.open(map,marker);
	});
	
}
</script >
<style>
	body {
	font-family: Arial, Helvetica, sans-serif;
	font-size:10pt;
	padding:0px;
	margin:0px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333;
}
	#title {
	background-color:#0066CC;
	padding:5px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #FFF;
}
	#current {
	font-size:10pt;
	padding:5px;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333;
}	
#formulario {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333;
	height: 225px;
	width: 320px;
}
#confirmacion {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333;
	height: 20px;
	width: 320px;
}
</style>
</head>
<body onLoad="initialize_map();initialize()">
	<div id="title"><strong>Mostrar Posición en el Mapa</strong></div>
	<div id="current">Inicializando...</div>
	<div id="map_canvas" style="width:320px; height:190px"></div>
	<div id="formulario"><FORM ACTION="insertar.php" METHOD="POST" target="_self">
<table width="320" border="0" cellspacing="0" cellpadding="5">
  <tr>
    <td colspan="2" align="center"><strong>Registro de Control de Visitas</strong></td>
    </tr>
  <tr>
    <td width="82" align="right">Nombre</td>
    <td width="218"><input name="name" type="TEXT" id="name" value="Juan Gomez" size="32" readonly="readonly" /></td>
  </tr>
  <tr>
    <td align="right">Dirección</td>
    <td><input name="address" type="TEXT" id="address" size="32" /></td>
  </tr>
  <tr>
    <td align="right">Tipo</td>
    <td><label>
      <select name="type" id="type">
        <option value="Opcion 1" selected="selected">Opcion 1</option>
        <option value="Opcion 2">Opcion 2</option>
        <option value="Opcion 3">Opcion 3</option>
      </select>
    </label></td>
  </tr>
  <tr>
    <td align="right">Latitud</td>
    <td><label>
      <input name="lat" type="text" id="lat" value="" />
    </label></td>
  </tr>
  <tr>
    <td align="right">Longitud</td>
    <td><label>
      <input name="lng" type="text" id="lng" />
    </label></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td><input type="SUBMIT" value="Guardar" /></td>
  </tr>
</table>
	</FORM></div>
	<div id="confirmacion"></div>
</body> 

Etiquetas: campo.de.texto, formulario, geolocalización, html, html5, php.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:21.