binding click Event on infoBox

[starenka]

Hi all!

I've just fell down the rabbit hole into this map Wonderland. Don't
bash me for asking a trivial question. I'm trying to bind a click
event on infoBox (http://code.google.com/p/google-maps-utility-library-
v3/source/browse/trunk/infobox/src/infobox.js?spec=svn50&r=49). The
event just don't seem to work at all (see the alert thing). What's my
problem? I can't provide an URL but, the functions which spawn
markers and windows is +- like this http://openpaste.org/en/20310/

PS. I need to open the infoboxes later - on demand (not only after
marker click). How should i do that? Is storing references to markers/
info boxes a good idea (f.e a dict with marker/boxes, where key is
hashed latlon)? How do you solve such things?

Thanks for your time & help

starenka

[Daniel Lee]

If you want to listen to *click* events within the InfoBox, you can probably add the listener to the HTML Node passed in as the content.  Have you tried this?

To open InfoBox, it's probably best to maintain a single global variable for which you can call anywhere.  This will also ensure only a single InfoBox is open at any moment.

Regarding Markers, it's never a bad idea to maintain a global collection of any Overlay objects added onto the map.  This includes Markers, Polygons, Polylines, Rectangle, Circle, etc.  In terms of what to use as the key in a Dictionary collection, I think it depends on what meta data is present in your app, as long as it's unique.



Hope this helps,

Dann

--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.
To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.

--
Daniel Lee
Developer Programs Engineer
Google, Inc.
345 Spear Street
San Francisco, CA 94105
650 253 0967

[Miguel.camba]

I have the same problem. Neither my InfoBoxes nor his internal
elements seems to capture click events.
I tried adding a listener to the infobox itself:
var ib = new InfoBox(opts);
google.maps.event.addListener(ib,'click',function()
{alert('click!')})
And with JQuery on the content
$('#infobox_content').click(function(){ alert('click') } )

On the options i have "enableEventPropagation" : true, so i have no
idea what's the problem.
It seems like i cant click the infobox and i pass through, clicking
the map.

Any idea?

On 14 abr, 21:19, Daniel Lee <daniel...@google.com> wrote:
> If you want to listen to *click* events within the InfoBox, you can probably
> add the listener to the HTML Node passed in as the content.  Have you tried
> this?
>
> To open InfoBox, it's probably best to maintain a single global variable for
> which you can call anywhere.  This will also ensure only a single InfoBox is
> open at any moment.
>
> Regarding Markers, it's never a bad idea to maintain a global collection of
> any Overlay objects added onto the map.  This includes Markers, Polygons,
> Polylines, Rectangle, Circle, etc.  In terms of what to use as the key in a
> Dictionary collection, I think it depends on what meta data is present in
> your app, as long as it's unique.
>
> Hope this helps,
>
> Dann
>
>
>
>
>
> On Sun, Apr 4, 2010 at 7:27 AM, starenka <staren...@gmail.com> wrote:
> > Hi all!
>
> > I've just fell down the rabbit hole into this map Wonderland. Don't
> > bash me for asking a trivial question. I'm trying to bind a click
> > event on infoBox (http://code.google.com/p/google-maps-utility-library-

> > v3/source/browse/trunk/infobox/src/infobox.js?spec=svn50&r=49<http://code.google.com/p/google-maps-utility-library-%0Av3/source/bro...>).

> > The
> > event just don't seem to work at all (see the alert thing). What's my
> > problem?  I can't provide an URL but, the functions which spawn

> > markers and windows is +- like thishttp://openpaste.org/en/20310/

>
> > PS. I need to open the infoboxes later - on demand (not only after
> > marker click). How should i do that? Is storing references to  markers/
> > info boxes a good idea (f.e a dict with marker/boxes, where key is
> > hashed latlon)? How do you solve such things?
>
> > Thanks for your time & help
>
> > starenka
>
> > --
> > You received this message because you are subscribed to the Google Groups
> > "Google Maps JavaScript API v3" group.
> > To post to this group, send email to
> > google-map...@googlegroups.com.
> > To unsubscribe from this group, send email to

> > google-maps-js-a...@googlegroups.com<google-maps-js-api-v3%2B unsub...@googlegroups.com>

[Chad Killingsworth]

You need to use addDomListener. addListener is only for map events.

Chad Killingsworth

[Miguel.camba]

I tried but it doesn't work for me. I paste my code.
//TODO: Comprobar que solo se muestra un infobox
var GM = google.maps;
var openedInfoBox;
function showInfoBox(marker){
$.getJSON('places/'+marker['id'],function(data){
var boxText = '<div class="infoBox smallBox"
id="infobox_'+marker['id']+'"><div class="infoBoxContent""> ';
boxText += "ID:"+ data['id']+"</div></div>";
if (openedInfoBox){
openedInfoBox.close() // Close other infobox, if
any
}
openedInfoBox = new InfoBox(addAttrs(["content"],
[boxText],infoBoxOpts)); //addAttrs returns a valid options literal
object
openedInfoBox.open(map, marker);

GM.event.addDomListener(openedInfoBox,'clikc',function()
{ alert('click!') }); // Dont works
//$("div.infoBoxContent").click(function()
{ alert('click!') }) // Dont works
});
}

Is this the way you suggested?

On 27 mayo, 19:09, Chad Killingsworth

<chadkillingswo...@missouristate.edu> wrote:
> You need to use addDomListener. addListener is only for map events.
>
> Chad Killingsworth
>
> On May 27, 11:42 am, "Miguel.camba" <miguel.ca...@gmail.com> wrote:
>
>
>
> > I have the same problem. Neither my InfoBoxes nor his internal
> > elements seems to captureclickevents.
> > I tried adding a listener to theinfoboxitself:
> >     var ib = newInfoBox(opts);
> >     google.maps.event.addListener(ib,'click',function()
> > {alert('click!')})
> > And with JQuery on the content
> >     $('#infobox_content').click(function(){ alert('click') } )
>
> > On the options i have "enableEventPropagation" : true, so i have no
> > idea what's the problem.

> > It seems like i cantclicktheinfoboxand i pass through, clicking

> > the map.
>
> > Any idea?
>
> > On 14 abr, 21:19, Daniel Lee <daniel...@google.com> wrote:
>

> > > If you want to listen to *click* events within theInfoBox, you can probably

> > > add the listener to the HTML Node passed in as the content.  Have you tried
> > > this?
>

> > > To openInfoBox, it's probably best to maintain a single global variable for

> > > which you can call anywhere.  This will also ensure only a singleInfoBoxis
> > > open at any moment.
>
> > > Regarding Markers, it's never a bad idea to maintain a global collection of
> > > any Overlay objects added onto the map.  This includes Markers, Polygons,
> > > Polylines, Rectangle, Circle, etc.  In terms of what to use as the key in a
> > > Dictionary collection, I think it depends on what meta data is present in
> > > your app, as long as it's unique.
>
> > > Hope this helps,
>
> > > Dann
>
> > > On Sun, Apr 4, 2010 at 7:27 AM, starenka <staren...@gmail.com> wrote:
> > > > Hi all!
>
> > > > I've just fell down the rabbit hole into this map Wonderland. Don't
> > > > bash me for asking a trivial question. I'm trying to bind aclick

> > > > event oninfoBox(http://code.google.com/p/google-maps-utility-library-

> > > > v3/source/browse/trunk/infobox/src/infobox.js?spec=svn50&r=49<http://code.google.com/p/google-maps-utility-library-%0Av3/source/bro...>).
> > > > The
> > > > event just don't seem to work at all (see the alert thing). What's my
> > > > problem?  I can't provide an URL but, the functions which spawn
> > > > markers and windows is +- like thishttp://openpaste.org/en/20310/
>
> > > > PS. I need to open the infoboxes later - on demand (not only after

> > > > markerclick). How should i do that? Is storing references to  markers/

[Chad Killingsworth]

It would really help if you'd post a link to your site.

I looks like you are trying to add the click event to the actual
InfoBox. You need to add the click event the the contents of the info
box. You'll need to create an actual DIV and attach the click event to
that.

Chad Killingsworth

[Luke Mahé]

Just looking at your code:

GM.event.addDomListener(openedInfoBox,'clikc',function()

You probably want it to say 'click' :)

- Luke

To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.

[Miguel.camba]

I have just found the error.
When i add the listener, the object i'm trying to bind doesn't exists
yet. And the JS console didn't show any warning because i was adding
the infobox content as a string like '<div id="foo"><div
id="foo_content">Blah</div></div>.
Until that string is loaded, parsed and the DOM is modified, im not
able to add listener.
I added a domready listener to the infobox that adds another listener,
like this:

GM.event.addListener(openedInfoBox,'domready',function(){
$('#infobox_8').click(function(){alert('clicked!')});
});

Maybe this should be added to documentation as an advice. I think it
could be a common mistake.
I felt in a dead end for hours with that stupid error.

Thank u all

> > > > > > > google-maps-js-a...@googlegroups.com<google-maps-js-api-v3%2B unsub...@googlegroups.com><google-maps-js-api-v3%2B