jQuery AJAX response object logs keys on console as undefined - php

Question

Accepted answer by Rohan Kumar:
Changed $.post() into
$.post("monitor/loadEVents", function(data){
if(data && data.response){ // (didn't even have to change this for it to work, but I like this condition more than my own one)
console.log('Wow, it works.');
} else {
console.log(data);
}
},'json'); // put the third parameter as json
Original question below:
I'm trying jQuery AJAX for the first time in Zend Framework 2 (I've never worked with AJAX before at all). That being said, I don't have very extensive experience in working with JSON yet either, so please forgive me for rookie mistakes ;)
In my js file I'm calling a function in my controller to return a JSON object. My problem is that when I log 'data' to the console, it logs the structure of it just fine, but when I try to do something with the keys of 'data', their values come back as undefined.
This is where I call the function:
$('#loadmore').on('click', function(event){
$.post("monitor/loadEVents", function(data){
if(data.response == true){
console.log('Wow, it works.'); // Want this condition met, but it never is.
} else {
console.log(data); // so it logs data
}
})
});
Here's the function inside my controller:
public function loadEventsAction(){
$request = $this->getRequest();
$response = $this->getResponse();
if($request->isPost()){
$events = array('a bunch' => 'of stuff');
$response->setContent(\Zend\Json\Json::encode(array('response' => true, 'events' => $events)));
}
return $response;
}
This is how it logs data:
{"response":true,"events":{"a bunch":"of stuff"}}
What do I do so I can get to the response and events keys in 'data' properly?

Answer 1

Try this,
$.post("monitor/loadEVents", function(data){
if(data && data.response){
console.log('Wow, it works.'); // Want this condition met, but it never is.
} else {
console.log(data); // so it logs data
}
},'json');// put the third parameter as json
Read post()