I'm getting a bit confused about what I need to do here to retrieve my articles in scripts.js from /articles to display on my marker. I have done ample reading about AJAX and $.getJSON, but still wonder whether there is something wrong with my code, and have been spinning my wheels.
I have read some answers to questions that seem to have provided an answer. However, they seem to suggest using methods that may no longer be a suggested way to approach the Pset.
I have also tried modeling my getJSON request after code like this that has been reported to work.
Any tips would be greatly appreciated! Thank you.
Edit: Code runs now and markers open, with no errors reported in console. However, spinning loading wheel appears above marker when clicked, and shows no signs of loading anything.
My articles function in application.py:
@app.route("/articles")
def articles():
"""Look up articles for geo"""
if not request.args.get("geo"):
raise RuntimeError("missing geo")
articles = lookup(request.args.get("geo"))
return jsonify(articles)
My relevant scripts.js code:
function addMarker(place)
{
var latLng = new google.maps.LatLng(place.latitude, place.longitude);
var marker = new google.maps.Marker({
position: latLng,
map: map,
title: "place.place_name"+ "place.admin_name1"
});
markers.push(marker)
var articles;
var contentString;
// get articles for place (https://cs50.stackexchange.com/questions/28726/cant-get-articles-on-my-marker-and-city-markers-are-persisting)
$.getJSON("/articles"), {geo: place.postal_code}, function(data, textStatus, jqXHR){
if (!$.isEmptyObject(articles)){
var contentString = "<ul>";
for (var i = 0; i < articles.length; i++)
{
// write html as javascript in this function to display the articles.; use the plus symbol to concatenate strings
contentString += "<li><a target='_NEW' href='" + articles[i].link + "'>" + articles[i].title + "</a></li>";
}
contentString += "</ul>";
}
});
marker.addListener('click', function(){
showInfo(marker, contentString);
});
}