Javascript AJAX Response, для проблемы с контуром

Question

У меня есть небольшая проблема. А именно, я хотел бы получить значение моей переменной: count_green за пределами цикла for. Кто-нибудь знает, как я могу это сделать? Вот отрывок из моего кода:

function State(type, count, list_name){ 
var count_green = 0; 
var count_yellow = 0; 
var count_red = 0; 

for (i = 0; i < count; i++){ 
    var jqxhr = $.ajax("/custom_data/getState/" + type[i]).done(function(result) { 
     for (j = 0; j < count; j++){ 
      if(result.type == type[j]){ 
       if(result.value == "GREEN"){ 
        $("#" + type[j]).css("color","#468847"); 
        count_green = count_green + 1; 
       } 
       if(result.value == "YELLOW"){ 
        $("#" + type[j]).css("color","#f89406"); 
        count_yellow = count_yellow + 1; 
       } 
       if(result.value == "RED"){ 
        $("#" + type[j]).css("color","#b94a48"); 
        count_red = count_red + 1; 
       } 
      } 
     } 
    }); 
} 
    //Here I would need the value of count_green, count_yellow and count_green 
    //Unfortunately they are outside of the for loop 0. 
    addCounters(count_green, count_yellow, count_red); 
} 

function addCounters(state_green, state_yellow, state_red){ 
    $(".line").find(".list").append('<span class="badge pull-left count_badge badge-success">' + state_green + '</span>'); 
} 

Как вы можете видеть, если я ставлю вызов метода: addCounters в течение цикла я получаю много значков, почему мне нужно получить доступ к COUNT-переменные: count_green, count_yellow и count_red вне цикла for и ajax-кода. Я видел некоторые решения с обратным вызовом, но мне нужно только один раз значение переменных, если я работаю с обратным вызовом, я получаю более 1 раза значения.

Заранее спасибо.

Answer 1

Одним из решений может быть синхронный запрос. http://api.jquery.com/jquery.ajax/ Посмотрите на свойство async.

$.ajax("/custom_data/getState/" + type[i], {async: false}).done(...) 

Другое решение будет выглядеть следующим образом

var requestCount = 0; 

for (i = 0; i < count; i++){ 
    var jqxhr = $.ajax("/custom_data/getState/" + type[i]).done(function(result) { 
     for (j = 0; j < count; j++){ 
      if(result.type == type[j]){ 
       if(result.value == "GREEN"){ 
        $("#" + type[j]).css("color","#468847"); 
        count_green = count_green + 1; 
       } 
       if(result.value == "YELLOW"){ 
        $("#" + type[j]).css("color","#f89406"); 
        count_yellow = count_yellow + 1; 
       } 
       if(result.value == "RED"){ 
        $("#" + type[j]).css("color","#b94a48"); 
        count_red = count_red + 1; 
       } 
      } 
     } 
     requestFinished(count_green, count_yellow, count_red); 
    }); 
} 

function requestFinished(count_green, count_yellow, count_red){ 
    requestCount++; 
    if(requestCount == count){//all requests finished 
     addCounters(count_green, count_yellow, count_red); 
    } 
}