1

I am currently working on Pset8 and just managed to implement the addmarker function. However, when I try to implement the getJSON part, the mashup gives me a Uncaught Type error: cannot read property "link" of undefined.

function addMarker(place)
{

//some code

google.maps.event.addListener(newMarker, "click", function(){
    var parameters = {
    geo : place.place_name
    };

$.getJSON(Flask.url_for("articles"), parameters)
.done(function(data, textStatus, jqXHR) {
    //start unordered list
    var content = "<ul id='articles'>";

    //cycle over length of data object (list of articles) and add each article
    for (i=0; i<=data.length; i++){


        article = data[i]

        content += "<li><a href=\"" + article.link + "\">" + article.title + "</a></li>";
        }

        //end unordered list        
        content += "</ul>";

        //pass content to showInfo  
        showInfo(newMarker, content);

        //console.log(content);

    if (data.length == 0) {
        content = "No news here - boring place!";
    }
})

.fail(function(jqXHR, textStatus, errorThrown) {

    // log error to browser's console
    console.log(errorThrown.toString());
});

});
markers.push(newMarker);



}

If I understand this correctly, the JSON returned by /articles?geo=... is what - in Python - would be a dict within a list. So by assigning data[i] to article and then accessing the list/title property respectively of the resulting object I should get the respective values to insert them into the infoWindow.

EDIT: This is what I get back when I visit my implementation with /articles?geo=cambridge

[
{
"link": "http://news.google.com/news/url?sa=t&fd=R&ct2=us&usg=AFQjCNGoAUJ9Ebu6-tOEvbQmUUk8tvpn2Q&clid=c3a7d30bb8a4878e06b80cf16b898331&ei=kN0lWdCmIsigzQavqan4Bg&url=http://cambridge.wickedlocal.com/news/20170523/emily-dexter-announces-bid-for-re-election-to-cambridge-school-committee", 
"title": "Emily Dexter announces bid for re-election to Cambridge School Committee - Wicked Local Cambridge"
}
]

My research regarding this error message has so far not brought up anything which helped me. Been banging my head against this one for a while now.

EDIT: Here is the error message from the chrome console:

scripts.js:90 Uncaught TypeError: Cannot read property 'link' of undefined
at Object.<anonymous> (scripts.js:90)
at j (jquery-latest.min.js:2)
at Object.fireWith [as resolveWith] (jquery-latest.min.js:2)
at x (jquery-latest.min.js:4)
at XMLHttpRequest.b (jquery-latest.min.js:4)
(anonymous) @   scripts.js:90
j   @   jquery-latest.min.js:2
fireWith    @   jquery-latest.min.js:2
x   @   jquery-latest.min.js:4
b   @   jquery-latest.min.js:4

So my question is quite simply: what am I doing wrong here?

Thanks for helping out.

2
  • Is articles returning a list of dictionaries or a list of a list of dictionaries? See if this post helps. May 24, 2017 at 21:21
  • Hey there, thank you! Been there, done that. But articles is in fact returning a list of articles. Post edited to account for that.
    – mor3dr3ad
    May 25, 2017 at 8:30

1 Answer 1

0

Okay, I have found the mistake - maybe someone else can benefit, although the mistake was stupid really.

The mistake was in the for-loop, specifically in the condition i<=data.length. The = initiated one element too many which was then undefined thus the error message.

i<data.length fixed it

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .