0

我有一个 Google Fusion Tables 地图,它使用下拉菜单根据列选择点。

在我尝试变得花哨之前,该地图工作正常。我尝试使用 php API 来简单地显示选定的下拉值。这有效,但地图会重新加载。有什么办法可以避免地图和表单重新加载?

如您所知,我对 PHP 有点陌生,所以如果我不清楚,请原谅我。

<!DOCTYPE html>
<html>
<head>
<style>
#map_canvas { width: 500px; height: 400px; }
</style>

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">    
</script>
<script type="text/javascript">
var map;

var layer;
var tableid = xxxxxx;

function initialize() {
map = new google.maps.Map(document.getElementById('map_canvas'), {
center: new google.maps.LatLng(38.98610025220408, -76.85897827148438),
zoom: 10,
mapTypeId: google.maps.MapTypeId.ROADMAP
});

layer = new google.maps.FusionTablesLayer(tableid);
layer.setQuery("SELECT 'lat' FROM " + tableid);
layer.setMap(map); 
}

function changeMap() {
var searchString = document.getElementById('searchString').value.replace("'", "\\'");
if(searchString == "") {
layer.setQuery("SELECT 'lat' FROM " + tableid);
return;
}
layer.setQuery("SELECT 'lat' FROM " + tableid + " WHERE 'Unit' = '" + searchString + "'");
}
</script>

</head>
<body onload="initialize();">

<div id="map_canvas"></div>

<div style="margin-top: 10px;">
<form method="post" action="<?php echo $PHP_SELF;?>">
<label>Unit </label>
<select class="dropdown" id="searchString" name="searchString">
<option value="">--Select--</option>
<option value="Ft Chaplin">Ft Chaplin</option>
<option value="Ft Davis">Ft Davis</option>
<option value="Ft Stanton">Ft Stanton</option>
<option value="Lower">Lower</option>
<option value="Middle">Middle</option>
<option value="Nash Run">Nash Run</option>
<option value="Piney Run">Piney Run</option>
<option value="Stickfoot">Stickfoot</option>
<option value="Upper">Upper</option>
</select>
<input type="submit" class="mapit"   onClick=" changeMap();" name="submit" value="Map it!"  align="middle">
</form>
</div>
<?php

include('../maps/client_login/clientlogin.php');
include('../maps/client_login/sql.php');
include('../maps/client_login/file.php');
$tableid = xxxxxx;
$username = "xxxx";
$password = "xxxx";
$token = ClientLogin::getAuthToken($username, $password);
$ftclient = new FTClientLogin($token);

$condition = $_POST["searchString"];


echo "These Projects are in ".$condition."";
?>
</body>
</html>`
4

1 回答 1

0

按钮:

<input type="submit" class="mapit"   onClick=" changeMap();" name="submit" value="Map it!"  align="middle">

提交表单并重新加载页面。

用一个按钮替换它:

<button class="mapit" onclick="changeMap()">Map It!</button>
于 2011-11-30T18:47:17.737 回答