Javascript callback functions with ajax

Question

I am writing a generic function that will be reused in multiple places in my script.

The function uses ajax (using jQuery library) so I want to somehow pass in a fun

Answer 1

This would be better done with jQuery's Deferred Objects. Have your AJAX call return the jqXHR object.

function getNewENumber(parentENumber) {
    return $.ajax( { ... } );
}

getNewENumber(E1 - 3).then(success_callback, error_callback);

If you want to keep the error callback within that function you can register that there instead:

function getNewENumber(parentENumber) {
    var jqXHR = $.ajax( { ... } );
    jqXHR.fail( ... );
    return jqXHR;
}

getNewENumber(E1 - 3).done(success_callback);

Answer 2

@patrick dw's anwser is correct. But if you want to keep calling the console.log (or any other actions) always, no matter what the caller code function does, then you can add the callback (your new parameter) inside the success function you already have:

function getNewENumber(parentENumber, cb_func /* <--new param is here*/){ 

    $.ajax({
           type: "POST",
           url: "get_new_e_number.php",
           data: {project_number: projectNumber, parent_number: parentENumber},
           success: function(returnValue){
                console.log(returnValue);
                cb_func(returnValue); // cb_func is called when returnValue is ready.
            },
            error: function(request,error) {
                alert('An error occurred attempting to get new e-number');
                // console.log(request, error);
            }
    });
}

And the calling code remains the same as yours except that the function will receive the returnValue by parameter:

var parentENumber = E1-3;

getNewENumber(parentENumber, function(val /* <--new param is here*/){
    alert(val);
});

Answer 3

Just give getNewENumber another parameter for the function, then use that as the callback.

   // receive a function -----------------v
function getNewENumber( parentENumber, cb_func ){

    $.ajax({
           type: "POST",
           url: "get_new_e_number.php",
           data: {project_number: projectNumber, parent_number: parentENumber},

             // ------v-------use it as the callback function
           success: cb_func,
            error: function(request,error) {
                alert('An error occurred attempting to get new e-number');
                // console.log(request, error);
            }
    });
}

var parentENumber = E1-3;

getNewENumber(parentENumber, function( returnValue ){
    alert( returnValue );
});