Desynchronized Ajax Queries?

Question

I'm working on a report application which grabs data from an aspx I made. In order to show the data, it uses ajax queries against that page. Depending on the parameters passed, the task can take long or short time.

Everything is okay up to that point. Problem is happening with this jquery code:

<script type="text/javascript">
    $(document).ready(function () {

        $('.preload').preload();
        $('.preload').each(function () {
            var obj = $(this);
            $.ajax({
                type: 'GET',
                url: 'GetCounter.aspx',
                success: function (data) {
                    obj.replaceWith(data);
                },
            });
        });

    });
</script>

The problem is that they are running synchronously, even if I set "async: true" to the ajax call. The first one in the selector runs, then the second one, and so on, even though they're all getting called at the same time because Firebug shows all the GET requests in the network tab.

Any ideas what could be wrong here?

Thanks in advance! - DARKGuy

That's down to your browser making 1 request at a time - nothing to do with your code. — Reinstate Monica Cellio, Jan 24 '13 at 16:12
No way, really? isn't there any way to avoid that and archieve what I want? I *think* I've seen other websites do so, but I can't recall which. — DARKGuy, Jan 24 '13 at 16:13
Well, they're getting chained without me wanting to do so, I actually want them to run all at once and replace the div's content with the result when they finish, individually, not sequentially. — DARKGuy, Jan 24 '13 at 16:14
It's a plugin I wrote (I'm a bit new at plugin writing) which loads an image and animates it, based on javascript from http://preloaders.net/en . Here's my plugin code: http://pastebin.ca/2306919 — DARKGuy, Jan 24 '13 at 16:17
Ajax is asynchronous... you send an XMLHTTPRequest and wait for response from server...what you probably want to say is that preload.each(..) should run after preload() has completed and returned? — Vikram, Jan 24 '13 at 16:22
Similar http://stackoverflow.com/questions/5118236/sessions-in-asynchronous-design — Musa, Jan 24 '13 at 16:26
Vikram, I thought Ajax was asynchronous, but what I'm working on shows me the contrary. preload() is just an image animator, let's take it off the recipe. I thought that by using each() the ajax calls would run individually, updating the one which finished first and such, which it isn't doing. Musa: It seems similar, but neither of the replies there offer help to my problem, neither are related to webservices or httphandlers. This is plain javascript/html. — DARKGuy, Jan 24 '13 at 16:38
@DARKGuy - it's not AJAX not being asynchronous. It's just that you can only have 1 active call at a time. It is still asynchronous in the respect that other code will continue to run. — Reinstate Monica Cellio, Jan 24 '13 at 16:49

score 1 · Answer 1 · answered Jan 24 '13 at 16:18

1

You're not really talking about aysnchronous AJAX there. You're talking about multi-threaded Javascript execution, and I'm fairly sure Javascript doesn't really do multithreading.

This might be useful to you: http://www.sitepoint.com/multi-threading-javascript/

answered Jan 24 '13 at 16:18

Dave Thomas

425
2
10

Hey, thanks for the link. From what I can see it uses setinterval() to run a function in a loop, and while it isn't busy it won't hang the browser. Luckily I'm not having that issue. As I see it (haven't tested yet) if I put an ajax call in the dummy loop it'll run without blocking the browser, but other ajax calls won't run because busy won't be false. – DARKGuy Jan 24 '13 at 16:43
No no... Just to make it clear: **Javascript is single threaded engine** unless you write your own web workers. – Robert Koritnik Jan 24 '13 at 17:12

Desynchronized Ajax Queries?

1 Answers1