Coffeescript Ajax-无法使变量在函数外部工作吗？

Question

So i have this coffeescript function:

thestring = ""
$.get '/ajax/questions', (data) -> 
    counter = 0
    dataLength = data.length
    while counter < dataLength
        thestring += "<option value=test>it wont work</option>"
        counter++   

console.log(thestring)
$("#question"+(numfilters+1)).append thestring

in my case, data is an array of arrays of length 2, (ex: [[hello,test],[hi,moretest]] ). The problem seems to be that my variable, "thestring", is only changed locally inside the function. When I attempt to log what the value is, i simply get whatever i initially assigned it (in this case the empty string). What I'm trying to do here is append options to a dynamically generated select box based on the data received from the ajax request.

Answer 1

This is an asynchronous function, so the code inside the callback will be set aside to be executed after the ajax request completes, and the rest of the top level function completes first. Just move your code for handling the result inside of the callback function:

thestring = ""
$.get '/ajax/questions', (data) ->
    # The code here will be run *after* the ajax function completes
    # This is called a callback 
    counter = 0
    dataLength = data.length
    while counter < dataLength
        thestring += "<option value=test>it wont work</option>"
        counter++   

    console.log(thestring)
    $("#question"+(numfilters+1)).append thestring

# Any code after here will execute immediately 
#  (i.e., before the ajax function completes)
# So if you access `thestring` here, it will still be empty
console.log thestring

Answer 2

I figured out why it wasn't appending to the select box. The variable "numfilters" was getting increased before it was evaluated in the asynchronous call. To solve this i assigned a new variable called "jaxfilters" right before the asynchronous call, which takes whatever value that numfilters has and is not increased.