How does one return data to the original caller function in Javascript?

Question

I have a problem returning data back to the function I want it returned to. Code below:

function ioServer(request_data, callback)
{
    $.ajax({
        cache: false,
        data: "request=" + request_data,
        dataType: "json",
        error: function(XMLHttpRequest, textStatus, errorThrown){},
        success: function(response_data, textStatus){
            callback(response_data);
            },
        timeout: 5000,
        type: "POST",
        url: "/portal/index.php/async"
    });
}   

function processRequest(command, item, properties)
{
    var request = {};
    request.command = command;
    request.item = item;
    request.properties = properties;
    var toServer = JSON.stringify(request); 
    var id = ioServer(toServer, processResponse);
    return id;
}

function processResponse(fromServer)
{
    if (fromServer.response == 1)
    {
        return fromServer.id;   
    }   
}

I invoke this piece of code by calling the processRequest function inside another function. Sending the request and retrieving the response works just fine. However, I need to return a value 'id' from the response back to the processRequest function, so it in turn can return that value to its caller. As far as I can follow, the return in processResponse returns to $.ajax, but I need it to return further back to processRequest.

BTW the if statement in processResponse refers to a value set by the server-side PHP script to tell whether the request was allowed (for instance if the user was not logged in, fromServer.response would be 0). It does not have anything to do with the success/error routines of the $.ajax object.

Many thanks for the help.

@Jani: Thanks for the response, but could you clarify a bit more? The function where 'id' is needed has the following code:

$(#tabs).tabs('add', '#tab-' + id, 'New tab');

Are you saying I should try to execute this piece of code in the processResponse function? Because that is not what I intented to do; these function are meant to be an all-purpose solution to maintain state server-side. That is why I avoided placing this piece of code there.

Answer 1

As Tony didn't provide any comments, let me add details about what he is suggesting.

As you have learned, the processRequest function completes as soon as $.ajax call is made because $.ajax method is asynchronous. So how would you notify the caller of processRequest that the task is done?

Simple, you ask that the caller of processRequest to supply a 'callback function'. The processRequest will call this function whenever it has received the ajax output. In tony's code, this is the last argument to the processRequest function.

So your calling code will now look like

function tabMethod() {
    processRequest('command', 'item', 'properties',
        function (id) {
            if (id == null) {
                alert('There is a problem!');
                return;
            }
            $('#tabs').tabs('add', '#tab-' + id, 'New tab');
        });
};