Return a value from an ajax call to parent function

Question

I have a function where I need to return a url that I am getting via an ajax call.

var heatmap = new google.maps.ImageMapType({
    getTileUrl: function(coord, zoom) {
        var tileURL;
        $.get('getimage.php', { zoom: zoom, x: coord.x, y: coord.y }, function(data) {
            if(data.status) { tileURL=data.image; }
        }, "json");
        return "tileURL";
    },
       tileSize: new google.maps.Size(256, 256),
       opacity:0.55,
       isPng: true
});

Obviously, the ajax call is asynchronous so I understand why the above code will return tileURL as undefined. I know in general people use callback functions to solve this issue, but I don't know how to get a call back to RETURN a value to the parent function. I'm working with the google maps API, so I don't really have any flexibility to change how that works.

Answer 1

Because the Ajax request is asynchronous, your only option is to use a callback. If you could return a value to the "parent" (really, "calling") function, then the request wouldn't be asynchronous; it would block the calling function. Also, there is no way to get a reference to the calling function from within a closure in that function. (i.e., you can't return to a function higher up in the call stack).