JSON object properties are undefined

Question

I'm getting a JSON object back from an AJAX call and logging the result like this:

console.log(response);

And this is the response logged in the console:

{"filename":"new.jpg","orientation":"vertical"}

However, when I

console.log(response.orientation);

I get a response that it is undefined.

Most of the answers I've read indicate that an array was returned instead of an object and that response[0].orientation should work, but that is not the case here. When I assign the same array to another variable in the console:

var obj = {"filename":"new.jpg","orientation":"vertical"}

Then obj.orientation returns the correct value.

I'm creating the JSON object in PHP:

$response=array('filename' => $newfilename, 'orientation' => $orientation);
$response=json_encode($response);
echo $response;

Is it apparent why the properties are showing undefined?

Answer 1

Either put:

header("Content-type: application/jason");

in the PHP, specify dataType: "json" in the AJAX call in the JavaScript, or call JSON.parse.

Answer 2

You will need to parse your string to get a proper JSON object. JSON.parse(response); will provide you with a JSON object from which you can read the properties