Queuing jQuery $.each iterations

Question

I'm guessing this should be simple, but I can't for the life of me find out how to do it.

I have an each loop, which runs through a number of products, and runs a function against each of them. This function, amongst other things, updates a table with the product's information. However, I need it to wait until 'runThisFunction()' completes, before moving on to the next product, and running the function again.

For example;

$.each(data.products, function(id, v) {
    runThisFunction(v);
});

Inside runThisFunction(), it pulls information about the product from the LocalStorage database, but because it runs so quickly, it moves on to the next product before it's done what it needs to do. I could add a delay, but I don't want to purposely slow it down.

I know this should be simple...

What is the code of runThisFunction ? There is maybe a way to make it synchronous. — Virus721, Jul 25 '13 at 12:13
It seems to me that you don't have an asynchronous process, so no need to queue your function. — gustavohenke, Jul 25 '13 at 12:13
could you provide a jsfiddle sample with relevant code? Are you sure `data.products[id]` is what you expect it to be? — A. Wolff, Jul 25 '13 at 12:14
You can use...`$.each(data.products, function(id, v) { runThisFunction(v); });` — DevlshOne, Jul 25 '13 at 12:15
I can only assume that `runThisFunction` does something asynchronous inside it, as the above code *is* synchronous and does queue the function calls. — Reinstate Monica Cellio, Jul 25 '13 at 12:26

score 0 · Answer 1 · edited May 23 '17 at 12:21

0

Have a look at the queue() function of jQuery. http://api.jquery.com/queue/

Another useful source: What are queues in jQuery?

edited May 23 '17 at 12:21

Community

1
1

answered Jul 25 '13 at 12:12

Pieter

1,823
1
12
16

The question has nothing to do with animation. – Reinstate Monica Cellio Jul 25 '13 at 12:27
No, but it explains the working of `queue()` and this function can be useful to answer the question. – Pieter Jul 25 '13 at 12:30
I've upvoted it. I agree, it may be useful, however it probably should be a comment. – gustavohenke Jul 25 '13 at 12:34
2

But queues are for animation. If they're not then please update your answer to explain how to use them otherwise. – Reinstate Monica Cellio Jul 25 '13 at 12:39
@Archer Queues **can** be used for animation, but also to avoid callback functions. Especially when there are a lot of callbacks (OK, that's not the case in this question ;-)). Blog about it: http://www.bitstorm.org/weblog/2011-2/How_to_use_the_jQuery_queue_function.html – Pieter Jul 25 '13 at 12:45
1

Interesting read - thanks Pieter. I doubt I'll ever use it but nice to learn something new :) – Reinstate Monica Cellio Jul 25 '13 at 13:08

score 0 · Accepted Answer · answered Jul 25 '13 at 14:23

As mentioned, further down in the runThisFunction(), it was accessing LocalStorage data for the product.

After much debugging, the issue was fixed by moving where the SQL statement variable was being defined, from outside of the db.transaction function, to inside.

Not quite sure why this was causing repercussions further up the code, but it's fixed the issue of the function within the $.each not firing synchronously.

Queuing jQuery $.each iterations

2 Answers2