$.getJSON returning "undefined" values, data reads [object Object]

Question

Thanks in advance for your help. I'm new to JSON and I've been trying to use $.getJSON to fill some form fields with no luck.

I started chopping pieces out until I was left simply testing my response from the server (my server is providing JSON when the URL listed below is viewed in a browser):

$(document).ready(function(){
    $('#button').live('click', function(){
        $.getJSON('http://localhost:8000/core/api/master-assembly/16', function(data) { 
        // alert(data); // uncomment for debug
           $('#showdata').html("<p>item1="+data.afAgeCounter+" item2="+data.afWordCounter+" item3="+data.idNumber+"</p>");
        });
    });
});

My JSON data looks something like:

{"success":true,"data":{"afWordCounter":123,"afAgeCounter":456,"idNumber":789, ...

When I run this script, I get the output:

item1=undefined item2=undefined item3=undefined

If I uncomment the

alert(data);

all I get in return is [object Object]

So what gives here?

You can't alert an object, you can however use console.log(data) and view the object in a javascript debugger such as Firebug. — jholloman
– jholloman, Commented Jul 26, 2012 at 21:50

Bogdan · Accepted Answer · 2012-07-26 21:46:58Z

2

You should be accessing it like this:

data.data.afWordCounter

since your json variable has this structure:

data = {
    "success":true,
    "data":{
         "afWordCounter":123,"afAgeCounter":456,"idNumber":789,
         ...

answered Jul 26, 2012 at 21:46

Bogdan

44.7k12 gold badges130 silver badges130 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

apttap Over a year ago

Thank you so much. I wish I could give you all credit for the answer.

gen_Eric · Accepted Answer · 2012-07-26 21:49:03Z

2

try

$('#showdata').html("<p>item1="+data.data.afAgeCounter+" item2="+data.data.afWordCounter+" item3="+data.data.idNumber+"</p>");

edited Jul 26, 2012 at 21:49

gen_Eric

228k42 gold badges304 silver badges343 bronze badges

answered Jul 26, 2012 at 21:46

Adrian Bratu

5083 silver badges9 bronze badges

Comments

gen_Eric · Accepted Answer · 2012-07-26 21:50:40Z

1

The data you're returning doesn't have a afAgeCounter, etc. property. It has a data property that has those.

You need to get that data property first.

if(data.success){
    data = data.data;
    $('#showdata').html("<p>item1="+data.afAgeCounter+" item2="+data.afWordCounter+" item3="+data.idNumber+"</p>");
}

answered Jul 26, 2012 at 21:50

gen_Eric

228k42 gold badges304 silver badges343 bronze badges

1 Comment

apttap Over a year ago

Thank you so much. Works like a charm, I appreciate the explanation too.

dougajmcdonald · Accepted Answer · 2012-07-26 21:52:11Z

1

As others have eluded to, your entire JSON result is the parameter to your callback - 'data', which is an object.

It has two properties, 'success' and 'data'. 'data' itself is and object {} with it's own properties, afWordCounter, afAgeCounter etc. So to get to the properties of the internal 'data' object you need to use data.data.afWordCounter etc

It may be clearer what's going on if you switch your method body to something like this:

    $.getJSON('http://localhost:8000/core/api/master-assembly/16', function(jsonresult)         { 

       $('#showdata').html("<p>item1="+jsonresult.data.afAgeCounter+" item2="+jsonresult.data.afWordCounter+" item3="+jsonresult.data.idNumber+"</p>");
    });

answered Jul 26, 2012 at 21:52

dougajmcdonald

20.2k12 gold badges61 silver badges100 bronze badges

Comments

Joe C · Accepted Answer · 2013-02-13 18:12:01Z

0

just piling on here, but if you're ever wondering what's contained in a js object, you can always print it to string using JSON.stringify: https://github.com/douglascrockford/JSON-js/blob/master/json2.js

so, the object in question, you can see what's contained in it via:

alert(JSON.stringify(mysteryObject));

or

console.log(JSON.stringify(mysteryObject);

answered Feb 13, 2013 at 18:12

Joe C

1471 gold badge1 silver badge9 bronze badges

Collectives™ on Stack Overflow

$.getJSON returning "undefined" values, data reads [object Object]

5 Answers 5

1 Comment

Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related