PHP-код перезагружает Google Fusion Table

У меня есть карта 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>`

php google-fusion-tables
person StormWater    schedule 30.11.2011    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Кнопка:

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

отправляет форму и перезагружает страницу.

Замените его кнопкой:

<button class="mapit" onclick="changeMap()">Map It!</button>
person webtweakers    schedule 30.11.2011
comment
хорошее предложение, но он все еще перезагружается. Я предполагаю, что это как-то связано с ‹form method=post action=‹?php echo $PHP_SELF;?›› - person StormWater; 01.12.2011
comment
Это кажется странным, поскольку сама по себе эта кнопка не отправляет форму. Вы можете полностью избавиться от элементов формы и кнопок и добавить в тег select следующее: onchange=changeMap(). Может быть, есть что-то еще, не в вашем примере выше, что отвечает за фактическую отправку формы? - person webtweakers; 04.12.2011