HighDots Forums  

Binding Google Maps V3 InfoWindow links

jQuery jQuery is a fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your web pages. jQuery is designed to change the way that you write JavaScript.


Discuss Binding Google Maps V3 InfoWindow links in the jQuery forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
benji
 
Posts: n/a

Default Binding Google Maps V3 InfoWindow links - 11-01-2009 , 12:39 PM






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

Reply With Quote
  #2  
Old   
benji
 
Posts: n/a

Default Re: Binding Google Maps V3 InfoWindow links - 11-04-2009 , 11:30 AM






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... (AT) gmail (DOT) com> wrote:
Quote:
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

Reply With Quote
  #3  
Old   
Michel Belleville
 
Posts: n/a

Default Re: [jQuery] Re: Binding Google Maps V3 InfoWindow links - 11-04-2009 , 11:45 AM



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 (AT) gmail (DOT) com>

Quote:
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... (AT) gmail (DOT) com> 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

Reply With Quote
  #4  
Old   
benji
 
Posts: n/a

Default Re: Binding Google Maps V3 InfoWindow links - 11-05-2009 , 06:56 AM



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.panelCont ainer").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... (AT) gmail (DOT) com>
wrote:
Quote:
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... (AT) gmail (DOT) com



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... (AT) gmail (DOT) com> 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

Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.