Salve ragazzi avrei un piccolo problemino.
In pratica ho due select create tramite ajax; le select in questione sono Regione e Provincia. Se un'utente seleziona ad esempio Lazio come Regione e Roma come Provincia, vengono visualizzati i negozi presenti nella città di Roma, i quali sono presi direttamente dal mio database mysql. Per rendere il tutto più performante ho inserito la mappa dell'italia con Google Maps e i marker vengono estrapolati tutti dal database. Ora vorrei però fare in modo di filtrare la mappa, ovvero se un'utente sceglie di visualizzare i negozi di Roma i marker dovrebbero scomparire tutti lasciando il posto solo a quelli localizzati su tale città.
Di seguito vi posto i file che ho utilizzato che, anche se i marker non vengono aggiornati, potrebbero comunque essere utili a chi cerca di realizzare qualcosa del genere.
Questa è la mia pagina html
La classe option.class.php
il file result.php
il file selection.php
Qualsiasi aiuto è altamente apprezzato. Grazie in Anticipo
In pratica ho due select create tramite ajax; le select in questione sono Regione e Provincia. Se un'utente seleziona ad esempio Lazio come Regione e Roma come Provincia, vengono visualizzati i negozi presenti nella città di Roma, i quali sono presi direttamente dal mio database mysql. Per rendere il tutto più performante ho inserito la mappa dell'italia con Google Maps e i marker vengono estrapolati tutti dal database. Ora vorrei però fare in modo di filtrare la mappa, ovvero se un'utente sceglie di visualizzare i negozi di Roma i marker dovrebbero scomparire tutti lasciando il posto solo a quelli localizzati su tale città.
Di seguito vi posto i file che ho utilizzato che, anche se i marker non vengono aggiornati, potrebbero comunque essere utili a chi cerca di realizzare qualcosa del genere.
Questa è la mia pagina html
Codice:
<head>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#sel_regione').change(function(){
var cont = jQuery('#sel_regione').attr('value');
jQuery.post("selection.php", {regione_id:cont}, function(data){
jQuery("#sel_provincia").empty();
jQuery("div#result").empty();
jQuery("#sel_provincia").prepend(data);
});
});
jQuery('#sel_provincia').change(function(){
var id_naz = jQuery('#sel_provincia').attr('value');
jQuery.post("result.php", {provincia_id:id_naz}, function(data){
jQuery("div#result").empty();
jQuery("div#result").prepend(data);
});
});
});
</script>
<?php $db = mysql_connect("miodb","user","pass");
mysql_select_db("dbname", $db); ?>
<script src="http://maps.google.com/maps?file=api&v=2&key=APIKEY" type="text/javascript"></script>
<script type="text/javascript">
var mioMarker = new google.maps.Marker({
map: map,
icon: mioLogo,
title:"mioTitle"
});
function createMarker(point,html) {
var marker = new GMarker(point);
GEvent.addListener(marker,"click",function(){ top.location = "#" });
return marker;
}
function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"),{ size: new GSize(580,400) } );
map.removeMapType(G_HYBRID_MAP);
map.setCenter(new GLatLng(43.036776,12.45758,0), 1);
map.setZoom(5);
var mapControl = new GMapTypeControl();
map.addControl(mapControl);
map.addControl(new GLargeMapControl());
<? $exe1="SELECT lat,lng FROM miatable"; //selezioni latitudine e longitudine
$result1 = mysql_query($exe1, $db)or die(mysql_error()); //estraggo i risultati
while(list($lat,$long) = mysql_fetch_row($result1)){
echo "\n var point = new GLatLng(".$lat.",".$long.");\n";
echo "var marker = createMarker(point,'');\n";
echo "map.addOverlay(marker);\n";
echo "\n"; //stampo i risultati con un ciclo loop
}
?>
}
}
</script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="regione">
<?php
include_once 'option.class.php';
$obj = new Option();
$obj->ShowRegione();
?>
</div>
<div id="provincia">
Seleziona una provincia:<br>
<select id="sel_provincia" name="sel_provincia"><option value="no">Scegli...</option>
</select>
</div>
<div id="result">
</div>
<div id="map_canvas" style="width: 580px; height: 300px"></div>
</body>La classe option.class.php
Codice:
<?php
class Option
{
public $conn;
public function __construct()
{
$this->DbConnectAndSelect();
}
protected function DbConnectAndSelect()
{
include_once "db_config.php";
$this->conn = mysql_connect($db_host,$username,$password);
mysql_select_db($db_name, $this->conn);
return TRUE;
}
public function ShowRegione()
{
echo 'Seleziona una regione:<br>';
echo '<select id="sel_regione" name="sel_regione"><option value="no">Scegli...</option>';
$sql = "SELECT * FROM table_regione";
$res = mysql_query($sql,$this->conn);
while($row = mysql_fetch_array($res))
{
echo '<option value="' . $row['regione_id'] . '">' . $row['nome'] . '</option>';
}
echo '</select>';
}il file result.php
Codice:
<?php
include_once 'option.class.php';
$obj = new Option();
$obj->ShowResult();
?>il file selection.php
Codice:
<?php
include_once 'option.class.php';
$obj = new Option();
$obj->ShowProvincia();
?>Qualsiasi aiuto è altamente apprezzato. Grazie in Anticipo
