0

I have a little problem. Namely, I would like to get the value of my variable: count_green outside of my for loop. Has somebody an idea how I can do that? Here is a snippet of my code:

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

As you can see if I put the method call: addCounters in the for loop I get many badges why I need to access the count-variables: count_green, count_yellow and count_red outside of the for loop and ajax code. I saw some solutions with callback but I need only one time the value of the variables, if I work with callback I get more then 1 time the values.

Thank you in advance.

cimbom
  • 259
  • 1
  • 5
  • 23

1 Answers1

1

One solution would be synchronous requests. http://api.jquery.com/jquery.ajax/ look at the async property.

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

Another solution would look like this

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);
    }
}
KVM
  • 878
  • 3
  • 13
  • 22