Question

I’m trying to figure out what the best way to handle a JSON object that I need to post/get when the document is ready so I can then run over another function that builds out the DOM based on said JSON object. This object is also something that updates every 30 seconds to a minute.

My initial thought was to build it out as a closure. i.e.:

var myJSONobject = $.post(uri, function(data){return data;});

however the function I run when the for document ready, and functions I base on click events don’t recognize the object as being valid. It returns a JSON object, and I’ve used jsonlint.com to confirm that the object format is valid. So I am thinking its in how I am handling the string of events. Where the object though it may be legit is being rendered after the document ready thus breaking the functionality in a sense. Cause if I take the same object it spits out and hard code it in as a variable. the code I’ve been working on works fine. So now I am trying to figure out whats my best approach to handling this so one, my script doesn’t break prematurely. and two find out if trying to adapt this as a closure the way I am is the right way? Whats a good practice logic in this type of scenario? Should I load the JSON object into a hidden div somewhere or text area and pass it through that or what?

Answer 1

$.post function does not actually return the return value of the success function, so you cannot just assign myJSONobject to it.

What you really want to do is

var myJSONobject;
$.post(uri, function(data){
    myJSONobject = data;
    // OR work with data here
});

// You cannot use myJSONobject right away

But be careful, you can’t access myJSONobject right after calling $.post, you need to wait until the ajax call succeded.