Perdon pero eso era la primera parte de la pregunta xD.
Cuando la seleccion del select ya esta en el input como puedo hacer para que busque autaomaticamente?
Nose si hay algun modo de simular las teclas del teclado y que se ejecuten (el input esta con un autocomplete y me gustaria seleccionar la primera opcion sin tener que seleccionar y dandole enter)
E estado buscando durante toda la mañana y no encuentro nada si alguien sabe gracias.
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>Mapa</title>
<link rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="js/mapa.js"></script>
<script type="text/javascript" src="js/util.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>
</head>
<body onload="mostrarmap()">
<div align="center">
<input name="address" id="address" type="text" size="50" onchange="">
<input type="button" onclick="limpiar()" value="limpiar busqueda">
<input type="button" onclick="clearOverlays()" value="borrar marcadores">
<input type="button" onclick="showmarks()" value="mostrar markers">
<input type="text" name="lat" id="lat" size="20">
<input type="text" name="long" id="long" size="20">
</div>
<div id="map"></div>
<div id="dircat" align="center">
<select name="select" id="datos" onchange="pasardatos()" size="5">
<option>Calle Ainzón, Zaragoza, España</option>
<option>Calle Alcalde Gómez Laguna, Zaragoza, España</option>
<option>Calle Cádiz, 8, 50004 Zaragoza, España</option>
<option>Avenida Pablo Gargallo, 50003 Zaragoza, España</option>
<option>Calle Santa Ines, 50003 Zaragoza, España</option>
<option>Calle la Vía, 50009 Zaragoza, España</option>
</select>
<ul id="check">
<li>
<label>Cine</label>
<input type="checkbox" id="chk1" name="chk1" />
</li>
<li>
<label>Restaurantes</label>
<input type="checkbox" id="chk2" name="chk2" />
</li>
<li>
<label>gimnasios</label>
<input type="checkbox" id="chk3" name="chk3" />
</li>
</ul>
</div>
</body>
</html>
JS:
var markersArray = [];
var map;
var geocoder;
var fldAddr;
var fldLng;
var fldLat;
function mostrarmap(){
div = document.getElementById('map');
fldAddr = document.getElementById("address");
fldLng = document.getElementById("long");
fldLat = document.getElementById("lat");
geocoder = new google.maps.Geocoder();
var zaragoza = new google.maps.LatLng(41.64871420000001, -0.8896260000000211);
var opciones = {
zoom : 14,
center: zaragoza,
disableDefaultUI: true,
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
},
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(div, opciones);
google.maps.event.addListener(map, 'click', function(event) {
addMarker(event.latLng);
});
var autocomplete = new google.maps.places.Autocomplete(fldAddr);
autocomplete.bindTo('bounds', map);
google.maps.event.addListener(autocomplete, 'place_changed', function() {
var place = autocomplete.getPlace();
if (place.geometry.viewport) {
map.fitBounds(place.geometry.viewport);
}
else {
map.setCenter(place.geometry.location);
map.setZoom(17);
var marker = new google.maps.Marker({
position: place.geometry.location,
animation: google.maps.Animation.DROP,
map: map,
draggable: true,
});
markersArray.push(marker);
google.maps.event.addListener(marker, "dragend", function() {
var coords = this.getPosition()
fldLat.value = coords.lat();
fldLng.value = coords.lng();
});
}
marcarDireccion();
});
}
function marcarDireccion() {
fldAddr.value = fldAddr.value.trim();
if (fldAddr.value) {
fldLat.value = "";
fldLng.value = "";
geocoder.geocode({'address': fldAddr.value}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
fldLat.value = results[0].geometry.location.lat();
fldLng.value = results[0].geometry.location.lng();
var txt = fldAddr.value = results[0].formatted_address;
if (txt) {
var calleCiudad = txt.split(',', 2);
txt = calleCiudad[0].trim() + "\n" + calleCiudad[1].trim() + "\n";
}
txt += "lat: " + fldLat.value + "\nlng: " + fldLng.value + "\n";
map.setZoom(17);
}
});
}
}
function clearOverlays() {
if (markersArray) {
for (i in markersArray) {
markersArray[i].setMap(null);
}
markersArray.length=0;
}
}
function pasardatos(){
var datoseleccionado = document.getElementById("datos").value
fldAddr.value=datoseleccionado;
fldAddr.focus();
}
function limpiar(){
fldAddr.value="";
}