StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>EDIT: I just saw that these are synchronous requests. If you want to stick with synchronous requests, I think you want to check out <a href="https://stackoverflow.com/questions/6685249/jquery-performing-synchronous-ajax-requests">this answer</a>. I've never used the synchronous option, but I'm pretty sure you don't specify a callback function. If you don't mind switching to asynchronous, I think the code at the bottom of my answer would still work.</p> <p>There are two places you are trying to append this content to the page. First, there's line 10:</p> <pre><code>$(item.data).appendTo("#content"); </code></pre> <p>That should work just fine, assuming you write your condition how you like. The second place is the last line:</p> <pre><code>$(html).appendTo("#content"); </code></pre> <p>This will fire before the content is loaded, appending a blank html string to the document. The trick is understanding that the AJAX requests, and this second appension, are executed immediately, but the <code>success</code> function loading the results into the variable <code>html</code> does not fire until the server sends back the requested information.</p> <p>My answer for how to fix this depends on what kind of condition is being checked in line 9. If it's something detectable via event listeners, I would rewrite <code>success</code> to do nothing but store the results in the global <code>html</code> variable, then write a second event listener that fires when your condition is met, appending the contents of <code>html</code> to your target and then clearing it. If, however, that condition cannot be detected with an event listener, I'd change your code to something like the following:</p> <pre><code>var html = ""; function loadByUrl(url) { $.ajax({ url: url, dataType: 'json', success: function(json) { $.each(json.data.children, function(i,item){ html += "<div>" + item.data + "</div>"; if( someCondition ) { $(html).appendTo("#content"); } }); }); } loadByUrl("http://fake1.com"); loadByUrl("http://fake2.com"); loadByUrl("http://fake3.com"); </code></pre> <p>If you want to be able to force it to append after you've finished loading <code>fake3.com</code>, use closure to do something like:</p> <pre><code>var html = ""; function successFunction(force) { return function(json) { $.each(json.data.children, function(i,item) { html += "<div>" + item.data + "</div>"; if (force || someCondition) { $(html).appendTo("#content"); } }); }; } function loadByUrl(url,force) { $.ajax({ url: url, dataType: 'json', success: successFunction(force)}); } loadByUrl("http://fake1.com",false); loadByUrl("http://fake2.com",false); loadByUrl("http://fake3.com",true); // true => force appension. </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload