I'm pretty much a newbie with regards to this code and jquery/
jscript..
so if you're kind enough to post a solution, really appreciate it..
Basically when entering an address, it looks up addresses around the
world and autofills...
However, I would only like it to look up addresses for a specific
country.
On my html page I have the following code...
<html>
<head>
<title>address suggest</title>
<link rel="stylesheet" href="googlemaps.css" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/
jquery.js"></script>
<script src="lib/jquery.googlemaps.js"></script>
<script src="googlemaps.js"></script>
<script src="http://maps.google.com/maps?
file=api&v=2&key=ABQIAAAAg_OTIrIDOoYO1Y7fk1CppRSSf0CfqtNriAlWTbzT5zlBJBs6dxQSCsOE_TE1um7bZS2QhQKGx_rTJQ"
type="text/javascript"></script>
</head>
<body>
Address:<input id="address" type="text" />
<div id="suggestion"></div>
<div id="map"></div>
</body>
</html>
This is the code in the googlemaps.js file...
$(document).ready(function(){
var api_key =
'ABQIAAAAg_OTIrIDOoYO1Y7fk1CppRSSf0CfqtNriAlWTbzT5zlBJBs6dxQSCsOE_TE1um7bZS2QhQKGx_rTJQ';
var map = $('#map').acts_as_map_container();
// params:
// container is required
// suggestion is the element which will contain the suggested
address, default to #suggested
// delay is the delay time for requesting google map api, default
to 500ms
var address = $('#address').acts_as_address({
api_key: api_key,
container: map,
suggestion: '#suggestion',
delay : 500
});
})
and this is the code in the jquery.googlemaps file
(function($){
var Address = {}
Address.timeout_id = 0;
$.fn.acts_as_address = function(user_defined_options){
Address.options = $.extend({
suggestion: '#suggestion',
delay: 500,
address: $(this)
},user_defined_options||{});
Address.options.suggestion = $(Address.options.suggestion);
Address.options.mark = null;
Address.delay_on_change = function (e) {
window.clearTimeout( Address.timeout_id );
Address.timeout_id =
window.setTimeout(Address.get_address_data, Address.options.delay );
}
Address.get_address_data = function(){
var address_value = Address.options.address.val();
Address.geocode(address_value, function(data) {
if(data) {
Address.options.suggestion.html("");
$.each(data,function(int_index,value){
append_element = "<tr><td>" + value.address +
"</td><td><button class='jquery-googlemaps-button' data-longitude='" +
value.longitude + "' data-latitude='" + value.latitude + "'>Select</
button></td></tr>";
Address.options.suggestion.append(append_element);
}); //end each
}
else {
alert('ERROR! Unable to geocode address');
}
}); //end geocode
} //end of getAddressData
Address.geocode = function(address, callback) {
jQuery.ajax({
dataType: 'jsonp',
url: 'http://maps.google.com/maps/geo?
output=json&oe=utf8&sensor=false' + '&key=' + Address.options.api_key
+ '&q=' + address,
cache: false,
success: function(data){
if(data.Status.code==200) {
var result = [];
$.each(data.Placemark,
function(int_index,value) {
var result_element={};
result_element.address = value.address;
result_element.longitude =
value.Point.coordinates[0];
result_element.latitude =
value.Point.coordinates[1];
result[int_index] = result_element;
});
callback(result);
} else {
callback(null);
}
}
}); //end ajax
}; //end geocode
function loadNewAddress(longitude, latitude){
if(Address.options.mark) {
Address.options.container.removeOverlay(Address.options.mark);
}
//update map
var pointB = new GLatLng(latitude,longitude);
Address.options.mark = new GMarker(pointB);
Address.options.container.addOverlay(Address.options.mark);
Address.options.container.setCenter(pointB, 14);
}
Address.options.address.keydown(Address.delay_on_change);
$(".jquery-googlemaps-button").live("click", function(){
var longitude = $(this).attr("data-longitude");
var latitude = $(this).attr("data-latitude");
var full_address = $(this).prev().text();
Address.options.address.val(full_address);
loadNewAddress(longitude, latitude);
});
} //end acts_as_address
})(jQuery);
(function($){
$.fn.acts_as_map_container = function(){
var that = this;
return (function(){
if (GBrowserIsCompatible()) {
var m = $(that)[0];
if(m) {
var map = new GMap2(m);
var start = new GLatLng(55,55);
var zoomLevel = 10;
map.setCenter(start, zoomLevel);
map.addControl(new GSmallMapControl());
return map;
}
}
})();
}
})(jQuery);
--
You received this message because you are subscribed to the Google Groups
"Google AJAX APIs" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-ajax-search-api?hl=en.
