How to return json object in javascript function?

Question

I've this function

function getTags(level){
    $.getJSON("php/get-tags.php", { "parent": level }, function(json) {
        return json;
    });
}

I'm calling this function as

$(function(){
    var tags = getTags('0');  
});

The problems is, in the function getTags() the return json is like

{"tags":["Mathematics","Science","Arts","Engineering","Law","Design"]}

but at var tags = getTags('0'), catching the return value, it gets an undefined value.

Is the way I'm returning the value incorrect?

Answer 1

Like many others already correctly described, the ajax request runs asynchronous by default. So you need to deal with it in a proper way. What you can do, is to return the jXHR object which is also composed with jQuery promise maker. That could looke like

function getTags(level){
    return $.getJSON("php/get-tags.php", { "parent": level });
}

and then deal with it like

$(function(){
    getTags('0').done(function(json) {
        // do something with json
    });
});