pset8 info window does not displaying news links

Question

function addMarker(place) { // TODO: Add a marker on the place at map. markers = place; var myLatLng = new google.maps.LatLng (parseFloat(markers.latitude), parseFloat(markers.longitude)); var articles; // contents for info window. var parameters = { geo: markers.postal_code };

// add label
var marker = new MarkerWithLabel({
   position: myLatLng,
   draggable: true,
   raiseOnDrag: true,
   map: map,
   labelContent: markers.place_name,
   labelAnchor: google.maps.Point(25, 0),
   labelClass: "labels", // the CSS class for the label
 });

$.getJSON("articles.php", parameters)
.done(function(data, textStatus, jqXHR) {

    // call typeahead's callback with search results (i.e., places)
    articles = "<ul>";
    var len = data.length;

    for (var i = 0; i < len; i++) {

          articles += "<div><li> <a href=\"" + data[i].link + "\" target=\"_blank\">" + data[i].title + "</li></div>";

      }
      articles += "</ul>";
      if(articles.length === 0){
        articles = "Slow News Day!";
        }
})


 google.maps.event.addListener(marker, 'click', function() {
 showInfo(marker, articles);

}); }

Answer 1

labelClass: "labels",

Defined in CSS as 'label', not 'labels'.

labelContent: markers.place_name,

The passed variable to this function is place, not markers.

Did you define the parameters variable for $.getJSON("articles.php", parameters) ? We should pass there geo: place.postal_code json.

Define the articles before you call the $.getJSON query, like:

var articles = "";
$.getJSON("articles.php", parameters)
    .done(function(data, textStatus, jqXHR) {

        articles = "<ul>";

Also you didn't close the <a> tag for title and added unnecessary <div> (we don't need this - div will be added in showInfo()

articles += "<li> <a href=\"" + data[i].link + "\" target=\"_blank\">" + data[i].title + "</a></li>";