Question

Have struggled with this call for a while now but i can’t get it to work. dataToReturn still returns Error and not the called data. What am i doing wrong?

function get_translation(search) {
    search = search.replace(/(<([^>]+)>)/ig, "").toLowerCase();
    original = search;
    google.language.translate( original ,  'en', 'sv', 
    function(result) {
        translated = result.translation;
        $("#results").html('<li class="ui-li-has-icon ui-li ui-li-static ui-btn-up-c" role="option" tabindex="0">'+ translated + '</li>')   
    });
};

function get_synonyms(items) { 



var dataToReturn = "Error";  

$.ajax({
    url: 'http://words.bighugelabs.com/api/1/xxx/' + items+ '/json',
    type: 'GET',
    dataType: 'jsonp',
    async: false,
    cache: false,
    success: function(data) {

       dataToReturn = data;
    }
});


return dataToReturn;

}


$('#results').delegate("li", "tap", function(){
    myDate = new Date();
    displayDate = myDate.getDate() + "/" + myDate.getMonth()+1 + "/" + myDate.getFullYear();
    id = myDate.getTime();

    var wordObject = {'id' : id, 'date': displayDate, 'translated': translated, 'original': original, 'nmbr': "0", 'syn': get_synonyms('hello')};
    save_terms(wordObject);
    loopItems() ;
    $("#results").html("");
    $("#addField").val("");
    // location.reload(true);
}); 

Answer 1

It’s because the return dataToReturn line is being executed before the AJAX call is complete. When you call $.ajax, the browser says, “Okay, I’ll just move on to the next thing while I’m waiting for that to get back to me.”

The simplest way to fix this would be to change the success function to actually do whatever it is you’re trying to do with dataToReturn. But if that’s not really feasible, then more context would help come up with a better answer.