Accessing values of a JSON-encoded object

Question

I am sending a JSON encoded array from my controller to my view page. I am doing this on my view page to get the data:

 function () {
     $.get('http://localhost/Location/loc', function(data){
         alert(data[0].message);
     });
 }

The data is like this

 {"message":"hello!"}

I am alerting the value of message but my alert giving me undefined. My question is how can I access values of JSON array?

I am new to JSON so I don't know much about JSON.

possible duplicate of [How to parse JSON in JavaScript](http://stackoverflow.com/questions/4935632/how-to-parse-json-in-javascript) — DevlshOne, Sep 22 '13 at 10:48
possible duplicate of [access property of json object](http://stackoverflow.com/questions/12346203/access-property-of-json-object) — Hussein Nazzal, Sep 22 '13 at 10:48
simply examine your json object in debugger. If you are using chrome, hit f12 to open it, go to source and set a breakpoint on that line with your alert. Then look into data — MichaC, Sep 22 '13 at 10:50
@mynameisbutt, ok, I posted an answer, hope that would work for you. — srain, Sep 22 '13 at 10:55

score 1 · Answer 1 · answered Sep 22 '13 at 10:44

1

You data contains a single object, not an array.

In your case use alert(data.message); instead.

An array is defined using [] brackets, for example [{message:"hello"}, {message:"world"}] is an array with two objects in it.

answered Sep 22 '13 at 10:44

Knaģis

20,827
7
66
80

@mynameisbutt - did you use Fiddler or another tool to see what exactly is returned from the server? – Knaģis Sep 22 '13 at 10:53

score 1 · Accepted Answer · answered Sep 22 '13 at 10:52

Try changing your function to:

function () {
     $.get('http://localhost/Location/loc', function(data){
         alert(data.message);
     }, 'json');
}

This is because jQuery probably doesn't know that the response data is JSON, so it's assuming that it's plaintext. You can explicitly specify it in $.get as the last parameter as in the revised code, or configure your server to send the response with the HTTP Content-Type header of application/json.

I'm assuming this because message is not a property of a String and that's why you're getting undefined.

Alternatively, you may use $.getJSON:

function () {
     $.getJSON('http://localhost/Location/loc', function(data){
         alert(data.message);
     });
}

Also note that I have changed the alert to data.message. See Knaģis' answer for explanation.

score 0 · Answer 3 · answered Sep 22 '13 at 10:54

0

OK, if this does not work:

function () {
     $.get('http://localhost/Location/loc', function(data){
         alert(data.message);
     });
}

try this:

function () {
     $.get('http://localhost/Location/loc', function(data){
         alert(data.message);
     }, 'json');
}

answered Sep 22 '13 at 10:54

srain

8,944
6
30
42

well thankyou ... it worked for me .. but as rink posted it first so i mark his answer . thankyou very much – mynameisbutt Sep 22 '13 at 11:01

Accessing values of a JSON-encoded object

3 Answers3