is it possible an iteration with asynchronous methods in javascript

Question

I have a JSP with a Struts 2 include:

<div id="data">
  <s:include value="list.jsp"/>
</div>

list.jsp has an iterator inside.

With JavaScript I have 3 functions that make an Ajax call to different actions and web services but the 3 functions refresh the same Java object list:

function firstCall(product) {
    // an ajax call 
    .done(function(html) {
      $("#data").append(html);
    });
}

function secondCall(product) {
    // an ajax call 
    .done(function(html) {
      $("#data").append(html);
    });
}

function thirdCall(product) {
    // an ajax call 
    .done(function(html) {
      $("#data").append(html);
    });
}

And i have another function that iterate a string array of products:

function iterate(productos){
    for(i=0;i<productos.length;i++){
        firstCall(productos[i]);
        secondCall(productos[i]);
        thirdCall(productos[i]);
    }
}

My problem is that I need these three methods to be asynchronous because each takes like 10 seconds. =(

There is a better way to do this?

Better than what? It's not clear what the issue is: you're already doing async calls; `firstCall` returns and `secondCall` starts before `firstCall`'s request has completed. What's the issue? Do you need to wait for all of them to be done before doing the DOM manipulation? — Dave Newton, Mar 16 '16 at 01:47
Why don't you call *once* every function (passing the whole array) instead of calling a huge amount of times every function (passing a single element) ? You'd have 3 calls no matter how many elements, against n*3... Just saying — Andrea Ligios, Mar 16 '16 at 08:48
the product will always be a long 3. So with the first product i need 3async calls but i don't know how to do it. when the 3calls finish go to the next product. — ernstr, Mar 16 '16 at 18:32

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

0

If you do NOT care about older browsers (who doesn't support ES6) you can use promises. It would become

new Promise(firstCall(productos[i]));
new Promise(seccondCall(productos[i]));
new Promise(thirdCall(productos[i]));
//You can add .then(function(){"code"}) to do something after it's done.

And your methods should have two new parameters: resolve and reject, that are functions that resolve or reject the promise. So .then works.

If you care about older browsers you can use another implementation https://www.promisejs.org/ or see is there a way to implement promises in ie9+

See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise for reference

edited May 23 '17 at 12:31

Community

1
1

answered Mar 16 '16 at 00:47

iovoid

193
2
11

sorry but i need ie9 ='( – ernstr Mar 16 '16 at 01:12
1

There are many ways to do promises outside of ES6. Like using jQuery deferreds. – Dave Newton Mar 16 '16 at 01:46
@ernstr I edit it to add a link to http://stackoverflow.com/questions/27835687/is-there-a-way-to-implement-promises-in-ie9 where it explains how to use promises in IE9 or even IE6+ ( http://stackoverflow.com/a/27839398/5776498 ) – iovoid Mar 17 '16 at 00:25

is it possible an iteration with asynchronous methods in javascript

1 Answers1