Everyone waits until $ .ajax is complete, 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 can I make it $.eachwait for the action to complete $.ajax, and then continue the cycle, I can’t get $ this var, because it has the last value, sorry for my English, THANKS !!!!

Answer 1

Option 1. Go to the next element of the array in the handler success.

Option 2: Sync ajax requests:

• 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);
          }
       }
  });
  

Answer 2

try putting ajaxsetup ({asynch: false}); before each cycle, then after the reset cycle it will return to true, so your future ajax request can still be asych

Answer 3

async false $.ajax.

Answer 4

In your call $.ajaxadd async: falseand it will send a lock request.