Javascript/JQuery noob here, so apologies.

I'm using .ajax to get a JSON object then the code below to loop through and append the fields to the page. Easy.

$.each(data, function(i, item) {
    $("#div-ipos").append(
        "<img src=" + item.user.avatar_small_url + ">&nbsp;"
        + item.user.first_name 
        + "<hr /><br />"
    );
});

It works and the output is as expected, plete with the avatar path passed into an <img> tag.

However I get the following error:

TypeError: 'undefined' is not an object (evaluating 'item.user.avatar_small_url')

What do I need to do to that variable to make it behave properly in this context?

Javascript/JQuery noob here, so apologies.

I'm using .ajax to get a JSON object then the code below to loop through and append the fields to the page. Easy.

$.each(data, function(i, item) {
    $("#div-ipos").append(
        "<img src=" + item.user.avatar_small_url + ">&nbsp;"
        + item.user.first_name 
        + "<hr /><br />"
    );
});

It works and the output is as expected, plete with the avatar path passed into an <img> tag.

However I get the following error:

TypeError: 'undefined' is not an object (evaluating 'item.user.avatar_small_url')

What do I need to do to that variable to make it behave properly in this context?

• javascript
• jquery
• arrays

• 2 Use item.user instead of item.sender? The latter seems to be undefined. – Frédéric Hamidi Commented May 4, 2012 at 19:55
• @FrédéricHamidi Apologies - corrected, was using wrong copy/paste. Please ignore! :) – a_good_swan Commented May 4, 2012 at 19:59
• Are some of the items in your JSON object missing their user property? In that case, you will have to test for that situation in your loop. – Frédéric Hamidi Commented May 4, 2012 at 20:05
• 1 Have you tried console.log( item )? It should give you the exact hierarchy of the object. – Matthew Blancarte Commented May 4, 2012 at 20:05
• Ok, weirdly now I'm getting 'cant find variable item' in console, but also OPTIONS [path to JSON] resource failed to load - yet I can get the path just fine using CURL and see the JSON returned! ARRRGH! – a_good_swan Commented May 5, 2012 at 10:51

3 Answers 3

Use console.log(data); before your $.each to check what's in it. Most likely the server response contains an extra array element with no user. So the JSON could look like:

[{"user":{"avatar_small_url":"foo","first_name":"bar"}},
 {"user":{"avatar_small_url":"bar","first_name":"foo"}},
 {"something_other_than_user":9000}]

See how the last array element doesn't have a "user". If you have access to the server code, you may want to modify it so there is always a user, or you may modify your Javascript so that it exits early if the user field doesn't exist with something like: if(typeof item.user == 'undefined') return;

Sounds like either item.user is not defined, or item is not defined. Have you checked the value of item? I think you are expecting it to be something that it is not.

before fetching check using if condition whether key is present in that array as below

if( key in User)
{
    User[key]
}