each wait until finish $.ajax , and then continue

Question

    function genTask(elem){
    elem.each(function(){
        $this=$(this).parent('.cntTasks');
        var pattern=/taskId-(.*)$/
        var idTask=$this.attr('id').match(pattern);
        var data='id_task='+idTask[1];
        if(typeof jsVar2 !='undefined') data+=jsVar2;
        $.ajax({
             type: "POST",
             url: domain+"/view_tasks/gen_tasks/",
             dataType: 'html',
             data: data,
             success: function(dt){
                $this.find('.contChildTasks').html(dt);
                childs=$this.children('.taskDesc').find('.has_child');
                if(childs.length!=0)
                    genTask(childs);
                }
             }
        });
        $this.find('.taskDesc').show();

    });
}

if(typeof jsVar2 !='undefined') genTask($('.cntTasks .has_child'));


});

how is possible to make $.each to wait until action $.ajax will be finished , and then continue loop , i cannot get $this var , because it has the last value , sorry for my English , THANK YOU !!!!

Maybe you could set the `async` attribute of $.ajax to `false`? See: http://api.jquery.com/jQuery.ajax/ — Armin, Dec 28 '11 at 15:01

score 23 · Accepted Answer · edited May 17 '20 at 05:56

Option 1: Switch to next element in your array in the success handler.

Option 2: Make ajax requests synchronously:

global:
```
 $.ajaxSetup({ async: false });
```

or directly in the request:

 $.ajax({
     async: false,
     type: "POST",
     url: domain+"/view_tasks/gen_tasks/",
     dataType: 'html',
     data: data,
     success: function(dt){
        $this.find('.contChildTasks').html(dt);
        childs = $this.children('.taskDesc').find('.has_child');
        if(childs.length != 0) {
            genTask(childs);
        }
     }
});

score 0 · Answer 2 · edited Aug 07 '20 at 06:48

0

try putting ajaxsetup({async:false}); before your each loop then after the loop reset it back to true so your future ajax request can still be async

edited Aug 07 '20 at 06:48

sauhardnc

1,961
2
6
16

answered Dec 28 '11 at 15:00

Laguna

3,706
5
27
42

score 0 · Answer 3 · edited Dec 28 '11 at 15:34

0

Set async to false on the $.ajax call.

edited Dec 28 '11 at 15:34

Tom van der Woerdt

29,532
7
72
105

answered Dec 28 '11 at 15:00

Joel A. Villarreal Bertoldi

7,829
8
35
51

score 0 · Answer 4 · answered Dec 28 '11 at 15:00

0

In your $.ajax call add async: false and it will send a blocking request.

answered Dec 28 '11 at 15:00

ridecar2

1,968
16
34

each wait until finish $.ajax , and then continue

4 Answers4

Linked