Multiple maps with clickevents

[Wouter]

Hi,

In my form-generator i want to use google maps so users can fill in
locations. I would like my generator to be able to support an
unlimited number of maps. The form-template generates an inputfield
(hidden) and a canvas-div for each map. My idea is to use javascript
to copy the latlang from a clickevent in the corresponding inputfield.

My html:
<label for='fieldname'>location</label>
<input class='hidden' id='fieldname' type='text' name='fieldname'
size='10' value='' readonly='readonly' />
<div id="fieldname_gmap" class="gmapform"></div>

My javascript:
var map = new Array();
var marker;

function init_gmap() {

//init maps
var mapzz = getElementsByClassName("gmapform", document, "DIV");
if ( mapzz ) {
for ( i=0; i<mapzz.length;i++ ) {
var loc =
document.getElementById(mapzz[i].id.replace("_gmap", "")).value;
if ( loc == "" ) { loc = "0,0"; }
loc = loc.split(",");
var latlng = new google.maps.LatLng(loc[0],loc[1]);
var myOptions = {
zoom: 7,
center: latlng,
mapTypeId: google.maps.MapTypeId.HYBRID
};
map[i] = new google.maps.Map(mapzz[i], myOptions);

google.maps.event.addListener(map[i], 'click',
function(event) { alert("here i would like to alert the mapid that
generated the event");});
}
}
}

I'm probable missing something very elementary here, but I cannot
figure out how to know the id of the canvas that triggered the
clickevent. Seems like event only has latlng, nothing else?

Any help on this is greatly appreciated!

[Rossko]

> I'm probable missing something very elementary here, but I cannot
> figure out how to know the id of the canvas that triggered the
> clickevent. Seems like event only has latlng, nothing else?

As you have a unique listener for each map, if listener N is fired the
user must have clicked on map N ...
Use function closure to capture the id or whatever of the map as you
create the listener.

[Wouter]

Thanks Rossko for your answer. Your solution sounds like the way to
go, but.. how do I capture the id in the function closure?
alert(map[i].id); doesnt work...

[Rossko]

> alert(map[i].id); doesnt work...

No, what would the value of 'i' be when the code is actually run?

> how do I capture the id in the function closure?

See
http://econym.org.uk/gmap/closure.htm
and other javascript tutorials, its not an easy concept.
Generally you take out the defining of the listener to another helper
function, to which you pass the value of 'i' or whatever you are
trying to capture.
An infowindow example
http://econym.org.uk/gmap/basic1.htm

[Wouter]

Thanks Rossko, that did the trick! Wasnt even that difficult, just 1
helper function that added the onclick.

On Nov 23, 2:10 pm, Rossko <ros...@culzean.clara.co.uk> wrote:
> > alert(map[i].id); doesnt work...
>
> No, what would the value of 'i' be when the code is actually run?
>
> >  how do I capture the id in the function closure?
>

> Seehttp://econym.org.uk/gmap/closure.htm