tengo un combo con 4 paises, al seleccionar un país por medio de ajax, cargo otro combo con las provincias de ese país, al seleccionar una provincia, tambien por ajax me crea un combo con las ciudades de esa provincia, hasta aí todo perfecto. El problema viene cuando al seleccionar una ciudad, por ajax tengo que mostrar la posición en el google map y permiter acomodar el marcador hasta donde corresponde y guardar las coordenadas. Esta última parte es la que no me funciona, no puedo hacer que me muestre el mapa no me termina de mostrar nunca nada reviso el html y no me muestra el código js.
Este es mi php:
Código PHP:
Ver original
/** * traigo todas las regiones de un pais * @version 0.1 * @author Lucas M. Sastre * @access public * @name regiones * * Modificaciones */ public function regiones() { $regiones = $this->Regiones->listadoRegiones($_REQUEST['pais']); $pais = $this->Paises->buscarPorPk($_REQUEST['pais']); $html = "<br/><br/><br/><p><label>Región / Provincia:</label></p>"; $html .='<select name="region" id="region" onchange="requestAjax(\'index.php?controlador=propiedades&accion=localidades\',\'region\',this.value,\'localidades\',1)"> <option value="">Seleccione una Región</option>'; foreach ($regiones as $region) { $html .= '<option value="'.$region['id'].'">'.$region['nombre'].'</option>'; } $html .='</select><br/><br/>'; echo $html; } /** * traigo todas las localidades de una region * @version 0.1 * @author Lucas M. Sastre * @access public * @name regiones * * Modificaciones */ public function localidades() { $localidades = $this->Localidades->listadoLocalidades($_REQUEST['region']); $region = $this->Regiones->buscarPorPk($_REQUEST['region']); $html = "<br/><br/><br/><p><label>Localidad / Ciudad:</label></p>"; $html .='<br/><select name="localidades_id" id="localidad" onchange="requestAjax(\'index.php?controlador=propiedades&accion=ciudad\',\'localidad\',this.value,\'geos\',1)"> <option value="">Seleccione una Localidad</option>'; foreach ($localidades as $localidad) { $html .= '<option value="'.$localidad['id'].'">'.$localidad['nombre'].'</option>'; } $html .='</select><br/><br/>'; echo $html; } /** * traigo los datos de la localidad * @version 0.1 * @author Lucas M. Sastre * @access public * @name regiones * * Modificaciones */ public function ciudad() { $localidad = $this->Localidades->buscarPorPk($_REQUEST['localidad']); $html .=' <br/><br/><br/><p><label>Logitud:</label> <input type="text" class="text-long" id="longitud" name="logitud" readonly value="'.$localidad->x.'"/> </p> <p><label>Latitud:</label> <input type="text" class="text-long" id="latitud" name="latitud" readonly value="'.$localidad->y.'"/> </p> <script type="text/javascript"> jQuery(document).ready(function() { var latitud = '.$localidad->y.'; var longitud = '.$localidad->x.'; function initialize() { //console.log("latitud: "+latitud); //console.log("longitud: "+longitud); var posi = false; var mapDiv = document.getElementById("map-canvas"); var map = new google.maps.Map(mapDiv, { center: new google.maps.LatLng( latitud , longitud), zoom: 5, mapTypeId: google.maps.MapTypeId.SATELLITE }); google.maps.event.addListener(map, "click", function(event) { if(posi){ alert("Ya hizo click en una posición"); } else{ var marker = new google.maps.Marker({ position: event.latLng, map: map, title:"La Propiedad se encuentra aquí!", draggable: true }); map.setCenter(event.latLng); posi = true; } }); } google.maps.event.addDomListener(window, "load", initialize); alert("siiiiiiiiiiii"); }); </script> '; echo $html; }
este es mi html
Código HTML:
Ver original
<select name="pais" id="paises" onchange="limpiar();requestAjax('index.php?controlador=propiedades&accion=regiones','pais',this.value,'regiones',1);"> <?php foreach ($paises as $pais) {?> <option value="<?php echo $pais['id'];?>" <?php if($pais['id']==$datos->pais) { echo "selected='selected'"; }?>><?php echo $pais['nombre'];?></option> <?php } ?> </select> </p> <div class="geo" style="display: none;"> </div> <p> <input type="hidden" name="id" value="<? echo $datos->id;?>"/> </fieldset>
y este es mi js:
Código Javascript:
Ver original
// funcion ajax para cargar contenido en un contenedor especifico function requestAjax(link,param,valor,contenedor,visible){ var url ; url = link; if(param!=''){ url = url+"&"+param; } if(valor!=''){ url = url+'='+valor; } $.ajax({ url: url, cache: false, success: function(data){ $.getScript('http://maps.google.com/maps/api/js?sensor=false&language=es_ES®ion=AR'); $.getScript(baseJs+'effects.js'); $.getScript(adminJs+'jNice.js'); $.getScript(adminJs+'funciones.js'); console.log('aca'); $("."+contenedor).empty(); $("."+contenedor).append(data); if(visible==1){ $("."+contenedor).css('display','block'); } } }); } function limpiar(){ $('.geo').empty(); $('.geos').empty(); $('.localidades').empty(); } $(document).ready(function(){ $('body #mensaje').click(function(){ $("body #mensaje").slideUp(); }); //calentario $.datepicker.setDefaults($.datepicker.regional['es']); $('#datepicker').datepicker({ changeMonth: true, changeYear: true }) $.datepicker.setDefaults($.datepicker.regional['es']); $('#datepicker2').datepicker({ changeMonth: true, changeYear: true }) //tabs $("#tabs").tabs(); $("#tabs2").tabs(); //si se cambio de pais una vez seleccionado limpio los divs $('#paises').live("change", function(){ $('.geos').empty(); }); });
En que le estoy errando?
desde ya muchas gracias!