调用多个AJAX调用相同的函数一个接一个

我有一个load_graphs函数，它执行AJAX调用创建一个图形。调用多个AJAX调用相同的函数一个接一个

需要多次调用load_graphs函数来为不同区域生成周期，如下所示。

尽管调用是使用包装函数顺序完成的，但它的调用是异步的。我怎样才能一个接一个地调用同一个AJAX函数。

function load_all_graphs(){ 
    load_graphs('national','','container-natl-rates','container-natl-counts') 
    load_graphs('division','Western','container-west-rates','container-west-counts') 
} 

load_all_graphs() 


var load_graphs = function(scope, scopeFilter, chart_1, chart_2){ 
      d = new Date() 
      starttime = d.setMonth(d.getMonth()-1) 
      starttime = d.setDate(d.getDate()-1) 
      endtime = (new Date).getTime() 
      // console.log('starttime == ', starttime) 
      // console.log('endtime == ', endtime) 
      if (scope == 'national'){ 
       url = 'http://99.88.53.222:8081/vp.0.1-SNAPSHOT/Metrics?scope='+ scope + '&interval=day&startTime='+starttime+'&endTime='+ endtime 
      }else { 
       url = 'http://99.88.53.222:8081/vp.0.1-SNAPSHOT/Metrics?scope=' + scope + '&scopeFilter=' + scopeFilter + '&interval=day&startTime='+starttime+'&endTime='+ endtime 
      } 
      if (scopeFilter == ''){ 
       data_filter = 'national' 
      } 
      else if (scopeFilter == 'Western'){ 
       data_filter = 'Western' 
      } 

      $.ajax({type:'GET', 
       url: url,    
       // async: false,   
       success: function(data){      
        // console.log(JSON.stringify(data)) 
        // console.log(data) 
        $.each(data,function(i,x){      
         console.log('national == ', x[0]['X1'])             
         console.log('national data_filter == ', data_filter)             
         console.log('national == ', x[0]['X1'][data_filter])             

         for (var i = 0; i <= 10; i++) 
         { 
          error_counts_results[i] = [] 
         } 
         $.each(x[0]['X1'][data_filter], function(unix_date,data){         
          if (parseFloat(unix_date)){ 
           $.each(error_constants, 
            function(ix,error_item){ 
             // console.log(ix) 
             // console.log(data[error_item]) 
             error_counts_results[ix].push([parseInt(unix_date),data[error_item]]) 
            } 
           ) 
          // console.log('result == ', JSON.stringify(error_counts_results)) 
          }       
         }) 
        }) 
        seriesOptions[0] = { 
         name: error_constants[5], 
         data: error_counts_results[5] 
        }; 
        console.log('option 1 == ', seriesOptions[0]) 
        seriesOptions[1] = { 
         name: error_constants[0], 
         data: error_counts_results[0] 
        }; 
        console.log('option 2 == ', seriesOptions[1]) 
        seriesOptions[2] = { 
         name: error_constants[3], 
         data: error_counts_results[3] 
        }; 
        console.log('option 3 == ', seriesOptions[2]) 
        params = { 
         'title':'National' 
         ,'y2axis':'pct' 
        }         
        createChart_National(chart_1,params); 
        seriesOptions[0] = { 
         name: error_constants[4], 
         data: error_counts_results[4] 
        }; 

        seriesOptions[1] = { 
         name: name, 
         data: error_counts_results[1] 
        }; 

        seriesOptions[2] = { 
         name: name, 
         data: error_counts_results[2] 
        }; 
        params = { 
         'title':'National' 
         ,'y2axis':'cnt' 
        }         
        createChart_National(chart_2,params); 

       },     
      }) 

     }

来源

2017-01-23 user1050619

您使用的角度，以一个良好的开端，这是什么问题？你想等待他们或什么？ –

阅读有关链接异步调用的承诺。 –

@DanielB这个问题建议我为泛型函数逐个调用..我实现了同样的功能，但仍然称为异步。 – user1050619

您可以使用promises将您的ajax调用链接在一起，jQuery已经将此内置到ajax函数中。

$.ajax({ // ... }) 
.then (function (arg) 
{ 
    // do something with arg 
}) 
.then (function(){ 

    return $.ajax({ }); // second ajax call, return the promise 

}) 
.done (function(args) 
{ 
    // do something with your final result 
});

如果你想在并行查找请求碰上使用promise.all

一般来说，我会推荐阅读有关的承诺，这里是http://dailyjs.com/2014/02/20/promises-in-detail/

来源

2017-01-23 18:53:56 ShaneDaugherty

调用多个AJAX调用相同的函数一个接一个

回答

相关问题