Home Cant access properties of object obtained via ajax call
Reply: 1

Cant access properties of object obtained via ajax call

Alejandro Suarez
1#
Alejandro Suarez Published in 2017-12-07 15:11:14Z

On Ajax success im getting the following data in a count variable. Using(snippet of ajax call success):

success: function (count) {
             console.log(count);
         }

And below console.log(count) hold this data as shown in browser console:

{
    '07/12/2017': {
        'day': {'failed': 0, 'success': 3}, 
        'night': {'failed': 0, 'success': 0}
    }, 
    '06/12/2017': {
        'day': {'failed': 2, 'success': 20}, 
        'night': {'failed': 1, 'success': 291}
    }, 
    '05/12/2017': {
        'day': {'failed': 6, 'success': 50}, 
        'night': {'failed': 1, 'success': 51}
    }
}

My issue when i try to access the data(all within the ajax success function), say i have a variable date = '07/12/2017' and i do count[date] i get undefined, but if i manually copy and hardcode the data to count like below then count[date] will return the object inside the corresponding date:

count = {
        '07/12/2017': {
            'day': {'failed': 0, 'success': 3}, 
            'night': {'failed': 0, 'success': 0}
        }, 
        '06/12/2017': {
            'day': {'failed': 2, 'success': 20}, 
            'night': {'failed': 1, 'success': 291}
        }, 
        '05/12/2017': {
            'day': {'failed': 6, 'success': 50}, 
            'night': {'failed': 1, 'success': 51}
        }
    }

Might be something simple but its totally escaping me right now.

Thanks in advance

T.J. Crowder
2#
T.J. Crowder Reply to 2017-12-07 16:09:03Z

From the evidence in the question and in the comments, I think count contains a string. What you've shown is invalid JSON and also not how any console I've ever seen represents objects when you console.log them, so I suspect it's a string and it's literally what's coming to your browser from the server.

If so, the server is sending invalid JSON. Property names (and all other strings) must be in double quotes, not single quotes.

So the solution is:

  1. Correct the server's output. The best way to output JSON is not to handcraft it, but instead to build an object graph and then use your server-side environment's equivalent of JSON.stringify.

  2. If you're still receiving a string at that point, update the server code to correctly identify what you're sending back as JSON by having it send this header:

    Content-Type: application/json
    

    jQuery will see that content type on the response and automatically parse the string for you.

Then, count will refer to an object graph, and your code using count[date] where date is the string 07/12/2017 will work.

Here it is working on jsFiddle using jsFiddle's handy "echo" feature which lets us tell the server to echo something back to us: https://jsfiddle.net/narxfmdm/ Here's the code in the fiddle:

var json = '{' +
'    "07/12/2017": {' +
'        "day": {"failed": 0, "success": 3}, ' +
'        "night": {"failed": 0, "success": 0}' +
'    }, ' +
'    "06/12/2017": {' +
'        "day": {"failed": 2, "success": 20}, ' +
'        "night": {"failed": 1, "success": 291}' +
'    }, ' +
'    "05/12/2017": {' +
'        "day": {"failed": 6, "success": 50}, ' +
'        "night": {"failed": 1, "success": 51}' +
'    }' +
'}';
$.ajax({
    type: "POST",
  url: "/echo/json/",
  data: {json: json, delay: 1},
  success: function(count) {
    var date = "07/12/2017";
    $("<p>").text("Data for " + date + ": " + JSON.stringify(count[date])).appendTo(document.body);
  }
});
You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.330379 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO