使用AJAX在Wordpress管理控制面板上对地址进行地理编码

Question

我正在为一家杂志创建一个网站，该网站有一个专门介绍事件的页面(如郡秀等)。这个页面的顶部有一个交互式地图(用谷歌地图构建)，然后是一个3col网格中的不同事件及其详细信息部分。

我的老板想拥有它，这样当网站所有者(我们称他们为编辑)添加活动时，他们就可以添加活动的地址。当编辑器保存事件时，它会对地址进行地理编码，并保存lat&lng进入他们自己的隐藏输入字段。

然后，在Google Maps语法中的Events页面上有一个循环，用于使用LatLng为每个事件创建标记。

我已经用地图创建了页面，但我不知道如何在后端对地址进行地理编码。

我不介意在保存帖子时是否自动进行地理编码，或者是否通过单击按钮手动转换。我只需要一种保存LatLng的方法，这样我就可以从循环中调用它。

那么我该怎么做呢？我知道我需要一些jQuery来处理AJAX请求，但这应该放在哪个文件中？(地理编码.php

代码时间！

Geocode.php：

$result = json_decode(file_get_contents($geoCodeURL), true); 
echo $result['results'][0]['geometry']['location']['lat'];
echo ',';
echo $result['results'][0]['geometry']['location']['lng'];

是的。。。这就是我的全部。

函数片段.pp

<td>
<form class="geocode" action="<?php bloginfo('template_url');?>/geocode.php" method="post">
<input type="text" name="addr" />
<input type="submit" value="" />
</form>
<input type="text" value="" name="eventLatLng" class="latlng" />
</td>

附言：如果这不清楚，我很抱歉，我从来没有使用过AJAX，我有点困惑，不知道如何解释，所以如果我没有得到太多帮助，我很遗憾。

Answer 1

以下是通过谷歌地图输入地址并获取其lat&长的

<!--code for google address api-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<input name="add" type="text" id="address" class="required" style="width: 500px;" onblur="cordinate()">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&libraries=places&language=en-AU"></script>
<script>
var autocomplete = new google.maps.places.Autocomplete($("#address")[0], {});
google.maps.event.addListener(autocomplete, 'place_changed', function() {
var place = autocomplete.getPlace();
console.log(place.address_components);
});
</script>
<!--code for google address api-->

<!--code for google address cordinates By Harshal-->
<script>
function cordinate()
{
geocoder = new google.maps.Geocoder(); // creating a new geocode object
address1 = document.getElementById("address").value;
if (geocoder)
{
geocoder.geocode( { 'address': address1}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK)
{
//location of first address (latitude + longitude)
var location1 = results[0].geometry.location;
document.getElementById("cor").value = location1;
//alert(location1);
} else
{
alert("Geocode was not successful for the following reason: " + status);
}
});
}//end of If
}
</script>
<!--code for google address cordinates-->
<input type="hidden" name="cor" id="cor">//in this input field you will get the cordinates.