Javascript loop does not await completion of ajax processes called within the loop before proceeding to next iteration

23 Views Asked by At

I'm new to javascript, so please bear with me. I'm trying to build a processing pipeline via a for loop where each iteration calls a different function that contains a jquery ajax call, based on the contents of the iterable element in the loop definition. The problem is that I need each iteration to wait until the ajax call completes before proceeding to the next loop because sometimes the results of the call may be required for the next loop. What I've built so far appears to just loop through the iterable instantaneous without waiting for the internal function to complete.

Can anyone help?

Here's a simplified version of my code:

var pipe_order = ['C', 'A', 'B']  // this is user-defined, order can change

function runProcessA() {
    var data = { "some_data": some_data }
    $.ajax({
        type: 'POST',
        contentType: 'application/json',
        url: '/run_ProcessA',
        data: data,
        success: (response) => {
            // return message for pipeline functionality
            var pipe_step_response = 'ProcessA Step Complete.'
            return pipe_step_response;
        }
    });
}


////////////////
// FOR SAKE OF SIMPLICITY, assume runProcessB() & runProcessC()
// are mostly identical to runProcessA()
////////////////


function runPipeline(pipe_order) {
    let index = 1;

    for (const process of pipe_order) {
        console.log('Pipeline beginning: Step ' + index);

        var step_complete = false;

        if (process==='A') {
            var step_complete = runProcessA(process);
        } else if (process==='B') {
            var step_complete = runProcessB(process);
        } else if (process==='C') {
            var step_complete = runProcessC(process);
        }

        // record that the process is finished
        console.log(step_complete)
        console.log('Pipeline finished: Step ' + index);

        // increment the index
        index++;
    }
}

Whenever I call runPipeline(), it just instantly completes the entire for loop without waiting for a value to be returned from the internal runProcess_() functions that are being called. How do I make it wait?

0

There are 0 best solutions below