Binding Google Maps V3 InfoWindow links

Hi -

Hope someone can help me out. Have spent days now trying to get this
running!

I am tying to bind a function to a link that is created dynamically in
the DOM when a Google Maps InfoWindow is fired. Specifically, getting
a JQuery Coda Slider 1.1.1 to work. You can see the test site here -
[click apply within an infowindow] http://tinyurl.com/coda-mapsv3-infowindow-test

I believe I have 2 options, neither of which i can figure out:
1. Google Maps JS V3 API fires the event DomReady when an infowindow
is opened: http://code.google.com/apis/maps/documentation/v3/reference.html#Info

Use JQuery Live to listen for the DomReady event (maybe a better,
lighter weight??) solution?

or

Add  tb_init('a.cross-link');  within the
google.maps.event.addListener function - I have tried adding this
(after the infowindowOption variable) this but cant seem to get it to
bind?

Here is the listener function (Maps V3)

  google.maps.event.addListener(marker, "click", function() {
    var infowindowOptions = {
      content: html
    };
    var infowindow = new google.maps.InfoWindow(infowindowOptions);
    cm_setInfowindow(infowindow);
    infowindow.open(map, marker);
    marker.setIcon(markerImageOut);
  });
  google.maps.event.addListener(marker, "mouseover", function() {
    marker.setIcon(markerImageOver);
  });
  google.maps.event.addListener(marker, "mouseout", function() {
    marker.setIcon(markerImageOut);
  });


  return marker;
}


Can anyone help. Please!

Many thanks

Benji

Hi, no response yet! please can someone try to help me out on this.
have spent a week trying to get it working - cheers

would the offer of a nice bottle of wiskey help :-)

cheers

B

On 1 Nov, 17:39, benji <bco...@...> wrote:

> Hi -
>
> Hope someone can help me out. Have spent days now trying to get this
> running!
>
> I am tying tobinda function to a link that is created dynamically in
> the DOM when a GoogleMapsInfoWindowis fired. Specifically, getting
> a JQueryCodaSlider 1.1.1 to work. You can see the test site here -
> [click apply within aninfowindow]http://tinyurl.com/coda-mapsv3-infowindow-test
>
> I believe I have 2 options, neither of which i can figure out:
> 1. GoogleMapsJSV3API fires the event DomReady when aninfowindow
> is opened:http://code.google.com/apis/maps/documentation/v3/reference.html#Info
>
> Use JQuery Live to listen for the DomReady event (maybe a better,
> lighter weight??) solution?
>
> or
>
> Add  tb_init('a.cross-link');  within the
> google.maps.event.addListener function - I have tried adding this
> (after the infowindowOption variable) this but cant seem to get it tobind?
>
> Here is the listener function (MapsV3)
>
>   google.maps.event.addListener(marker, "click", function() {
>     var infowindowOptions = {
>       content: html
>     };
>     varinfowindow= new google.maps.InfoWindow(infowindowOptions);
>     cm_setInfowindow(infowindow);
>    infowindow.open(map, marker);
>     marker.setIcon(markerImageOut);
>   });
>   google.maps.event.addListener(marker, "mouseover", function() {
>     marker.setIcon(markerImageOver);
>   });
>   google.maps.event.addListener(marker, "mouseout", function() {
>     marker.setIcon(markerImageOut);
>   });
>
>   return marker;
>
> }
>
> Can anyone help. Please!
>
> Many thanks
>
> Benji

[Michel Belleville]

I fail to see where you encounter a problem. I'd use
$('#any_other_container a.whatever_link').live('click', function() {

// here be your code

});

Thanks for the bottle but I don't drink much (and I don't think it helps a lot while coding anyway).

Michel Belleville

2009/11/4 benji <bcorke@...>

Hi, no response yet! please can someone try to help me out on this.
have spent a week trying to get it working - cheers

would the offer of a nice bottle of wiskey help :-)

cheers

B

On 1 Nov, 17:39, benji <bco...@...> wrote:
> Hi -
>
> Hope someone can help me out. Have spent days now trying to get this
> running!
>

> I am tying tobinda function to a link that is created dynamically in

> the DOM when a GoogleMapsInfoWindowis fired. Specifically, getting

> a JQueryCodaSlider 1.1.1 to work. You can see the test site here -
> [click apply within aninfowindow]http://tinyurl.com/coda-mapsv3-infowindow-test

>
> I believe I have 2 options, neither of which i can figure out:

> 1. GoogleMapsJSV3API fires the event DomReady when aninfowindow

> is opened:http://code.google.com/apis/maps/documentation/v3/reference.html#Info
>
> Use JQuery Live to listen for the DomReady event (maybe a better,
> lighter weight??) solution?
>
> or
>
> Add  tb_init('a.cross-link');  within the
> google.maps.event.addListener function - I have tried adding this
> (after the infowindowOption variable) this but cant seem to get it tobind?
>
> Here is the listener function (MapsV3)
>
>   google.maps.event.addListener(marker, "click", function() {
>     var infowindowOptions = {
>       content: html
>     };

>     varinfowindow= new google.maps.InfoWindow(infowindowOptions);

>     cm_setInfowindow(infowindow);
>    infowindow.open(map, marker);
>     marker.setIcon(markerImageOut);
>   });
>   google.maps.event.addListener(marker, "mouseover", function() {
>     marker.setIcon(markerImageOver);
>   });
>   google.maps.event.addListener(marker, "mouseout", function() {
>     marker.setIcon(markerImageOut);
>   });
>
>   return marker;
>
> }
>
> Can anyone help. Please!
>
> Many thanks
>
> Benji

Thanks Michel.

Might not seem an issue for you but as a novice it is not so easy for
me :(

OK added Jquery LiveQuery (i am on $1.2.6)

the problem is I can't seem to be able to overcome is that the Coda
slider is initialised by default to the window load function ie

$(window).bind("load", function() {$("div#slider1").codaSlider()});

and the on click event is defined and applied by the global function
in the coda-slider.js so simply adding the following does not work

$('#slider1 a.crosslink').live('click', function() {
        $("div#slider1").codaSlider()
                });

I guess as the coda slider is not initialised via an on click event
but window onload and I need to rebind the onclick function (contained
within the global function) to the dynamically created a.cross-link

So, I looked within the coda-slider JS and found what I think is the
relevant onclick function and called that within the LiveQuery
function but this still does not work, probably because the script
traverses the DOM using parent selectors and applys the onClick
function to the parent div.panelContainer which it is out of context
in the dynamic content ??? - clearly this is where i get VERY lost.

This is what i tried - still no luck. (see it here
http://tinyurl.com/coda-mapsv3-infowindow-test )

$('#slider1 a.crosslink').live('click', function() {
        jQuery(this).parent().parent().find("div.panelContainer").animate
({ left: cnt}, settings.easeTime, settings.easeFunc);
                                // Change the URL hash (cross-linking)...
                                location.hash = cPanel;
                                return false;
                });

I guess as this is out of the main function it gets lost too?

Any ideas what i may be doing wrong here??

if you don't like whiskey maybe a carton of um bongo if/when they
bring it back? http://www.bringbackumbongo.co.uk/ :-)

cheers

Ben




On Nov 4, 4:45 pm, Michel Belleville <michel.bellevi...@...>
wrote:

> I fail to see where you encounter a problem. I'd use
> $('#any_other_container a.whatever_link').live('click', function() {
> // here be your code
>
> });
>
> Thanks for the bottle but I don't drink much (and I don't think it helps a
> lot while coding anyway).
>
> Michel Belleville
>
> 2009/11/4 benji <bco...@...>
>
>
>
> > Hi, no response yet! please can someone try to help me out on this.
> > have spent a week trying to get it working - cheers
>
> > would the offer of a nice bottle of wiskey help :-)
>
> > cheers
>
> > B
>
> > On 1 Nov, 17:39, benji <bco...@...> wrote:
> > > Hi -
>
> > > Hope someone can help me out. Have spent days now trying to get this
> > > running!
>
> > > I am tying tobinda function to a link that is created dynamically in
> > > the DOM when a GoogleMapsInfoWindowis fired. Specifically, getting
> > > a JQueryCodaSlider 1.1.1 to work. You can see the test site here -
> > > [click apply within aninfowindow]
> >http://tinyurl.com/coda-mapsv3-infowindow-test
>
> > > I believe I have 2 options, neither of which i can figure out:
> > > 1. GoogleMapsJSV3API fires the event DomReady when aninfowindow
> > > is opened:
> >http://code.google.com/apis/maps/documentation/v3/reference.html#Info
>
> > > Use JQuery Live to listen for the DomReady event (maybe a better,
> > > lighter weight??) solution?
>
> > > or
>
> > > Add  tb_init('a.cross-link');  within the
> > > google.maps.event.addListener function - I have tried adding this
> > > (after the infowindowOption variable) this but cant seem to get it
> > tobind?
>
> > > Here is the listener function (MapsV3)
>
> > >   google.maps.event.addListener(marker, "click", function() {
> > >     var infowindowOptions = {
> > >       content: html
> > >     };
> > >     varinfowindow= new google.maps.InfoWindow(infowindowOptions);
> > >     cm_setInfowindow(infowindow);
> > >    infowindow.open(map, marker);
> > >     marker.setIcon(markerImageOut);
> > >   });
> > >   google.maps.event.addListener(marker, "mouseover", function() {
> > >     marker.setIcon(markerImageOver);
> > >   });
> > >   google.maps.event.addListener(marker, "mouseout", function() {
> > >     marker.setIcon(markerImageOut);
> > >   });
>
> > >   return marker;
>
> > > }
>
> > > Can anyone help. Please!
>
> > > Many thanks
>
> > > Benji