jQuery Ajax调用未处理.done

Question

I have been beating my head against this desk, and I am not sure why javascript/jQuery (1.71) is not completing it's tasks before doing something else.

I am calling a function that is strictly a jQuery Ajax call. The function performs the Ajax portion, but the .done is not being processed before it leaves the function and returns to the original calling function.

If you look through the code, I stripped out non-essential code, but left the call. So I call the processAjax function. As I trace through it, the function is called, the Ajax process is performed, and then it returns to the dups function and the alert ('stopping here') is triggered before the done section is processed.

What's going on?!?

Here is some code:

function dups(){
    $('#dupChecker').val(2);
    if ($('#spDegree').length){
    // do logic here

    }

    else if ($('#meetingID').length){
    // do logic here            
    }

    else {
    // do logic here            
    }

    processAjax(user, actDate, meetID, degree, act);

    alert('stopping here');

    return 0;

};

function processAjax(a,b,c,d,e){

    $.ajax({
        url: "deSubmit_testDups.cfm",
        cache:false,
        method: "POST",
        data: {id:a, aDate:b, meet:c, degree:d, act:e},
        dataType: "html"
    })          

    .done(function( html ) {
        myResult = parseInt($.trim( html ));
        alert ('myresult= '+ myResult);
        if (myResult == 0){
            $('#submitBTN').prop("disabled",false);
            $('#errorMsg').css("visibility","hidden");
            $('#dupChecker').val(1);
        }
        else {
            $('#submitBTN').prop("disabled",true);
            $('#errorMsg').css("visibility","visible");
            $('#dupChecker').val(0);
        }
    })

    .fail(function( jqXHR, textStatus ) {
    alert( "Request failed: " + textStatus );
    });

};

Answer 1

function dups(){
    $('#dupChecker').val(2);
    if ($('#spDegree').length){
    // do logic here

    }

    else if ($('#meetingID').length){
    // do logic here            
    }

    else {
    // do logic here            
    }

    processAjax(user, actDate, meetID, degree, act, function(resp){
         alert('stopping here');
    });



    return 0;

};

function processAjax(a,b,c,d,e, callback){

    $.ajax({
        url: "deSubmit_testDups.cfm",
        cache:false,
        method: "POST",
        data: {id:a, aDate:b, meet:c, degree:d, act:e},
        dataType: "html"
    })          

    .done(function( html ) {
        myResult = parseInt($.trim( html ));
        alert ('myresult= '+ myResult);
        if (myResult == 0){
            $('#submitBTN').prop("disabled",false);
            $('#errorMsg').css("visibility","hidden");
            $('#dupChecker').val(1);
        }
        else {
            $('#submitBTN').prop("disabled",true);
            $('#errorMsg').css("visibility","visible");
            $('#dupChecker').val(0);
        }
        callback();
    })

    .fail(function( jqXHR, textStatus ) {
        alert( "Request failed: " + textStatus );
        callback();
    });

};

Hope this helps you. You can use a callback to make it synchronous. You can also pass the ajax response to the callback.