0

I 'm beginer to js and coding and i trying build an web site with google map + places api, so when type "restaurant or bar or etc" to shw this business on map and on sidebar.

http://jsbin.com/ayugun/46/edit

All code works fine without sidebar code:

var side_bar_html = "<a href='javascript:google.maps.event.trigger(gmarkers["+parseInt(gmarkers.length-1)+"],\"click\");'>"+place.name+"</a><br>";
     document.getElementById('side_bar').innerHTML += side_bar_html;

but I need to repair this code to make it workable. So when I type" restaurant or bars or etc." to show me on map and on #side_bar

WHere is error in my code for sidebar?

sorry for my englsih, is not very well, but I learn hard to learn english and coding.thanks

Mark West
  • 269
  • 2
  • 5
  • 17

1 Answers1

0

Your gmarkers variable is undefined. It simply does not reach part of appending it to the 'side_bar'.

Also, why not to do this such way?

 var sideClick = jQuery("<a class=side_click href='#'></a>");
 $(sideClick).html(place.name);
 $("#side_bar").append(sideClick);
 $(sideClick).on("click", function() {
     google.maps.event.trigger(gmarkers[parseInt(gmarkers.length-1)], "click");
 });

The problem with your initial code - it can not access the place variable (besides the fact that javascript: is kind of bad practice). So, by putting it all into callback for google.maps.event.addListener(searchBox, 'places_changed', function() {..} it now can access place variable and get name value of current looping place.

I am still not sure what is with gmarkers (maybe, it should be markers (misspeling)?). It did not declared anywhere.

Here is working version (without gmarkers part, it is still broken): http://jsbin.com/ayugun/54/

You may like to discover more about closures in JavaScript:
Good answers about it on StackOverflow.
Material from Google docs for the Maps. (the part under Using Closures in Event Listeners header). This example is related to the Google Maps and great for showing what is closure in real life.

Community
  • 1
  • 1
Gene D.
  • 311
  • 1
  • 15
  • thanks, but when I click on sidebar link wont open infowindow (modalbox) ? – Mark West Jun 15 '13 at 21:07
  • also when I type new search, sidebar links not changed, why that? – Mark West Jun 15 '13 at 21:10
  • 1) Take a look at the code - on callback it executes "google.maps.event.trigger(gmarkers[parseInt(gmarkers.length-1)], "click");". Which is still broken. I have no idea what `gmarkers` is - it is undefined. You have to figure out what variable you want to pass. 2) What do you mean? It works for me in Chrome and Firefox, it adds new links to the sidebar when new search was performed. I just show working closure, you are free to bend the rules as you want - `empty()` sidebar on changes and whatever. – Gene D. Jun 15 '13 at 21:18
  • yes, on chaneges sidebar must be pulled with new links, and also when i click on sidebar links won't to open infowindow in map ? – Mark West Jun 15 '13 at 21:20
  • i dont know what is the gmarkers, becouse I copy this part of code from an exmple – Mark West Jun 15 '13 at 21:25
  • I am sorry, but this is a very bad attitude to problem solving - I recommend you to read documentation and to actually understand code you copying next time. What you asked for is bug-hunting and feature implementing, not helping, it is disliked usually. Anyway, here is the working version http://jsbin.com/ayugun/57/ you can review the code. – Gene D. Jun 15 '13 at 22:06
  • very very thanks, I will show you what aplication will do with this code. thanks so much, you are the best! – Mark West Jun 15 '13 at 22:22
  • Why when I type etx. "Paris, France" with autosuggestion, don't find anything, just map zoom on some other place? – Mark West Jun 27 '13 at 14:15