Search code examples
javascriptjquerycallbackjquery-callback

javascript callback functions - multiple functions not executing


I'm using the jquery form plugin to submit forms to my MVC application. The problem is in my callback "success" callback function. In this function I make 2 calls to other javascript functions that I have. One refreshes part of the page, and the other posts a message to the user on another part of the page.

The problem is, only one of these will execute. It's whichever I put first in the callback function. I've tried to explicitly return a value from the first function to try to get control back to the callback function and it's just not working. I don't want to get rid of my two separate functions because I use this code a lot and I really want to keep it in once place.

Here's the code. (the alert statement is in there just to prove to me that it wasn't working)

 function ShowProposedDate_Submit() {
    // prepare Options Object 
    var options = {
        dataType: 'json',
        success: function (responseText) {
            $("#blankModal").dialog("close");
            var ret = RefreshGrid(); //this function will execute but will not return
            alert(ret); //this statement won't execute
            PostMessage(responseText.msg); //this function won't execute



        },
        error: function (responseText) {
            $("#feedback").html(responseText.msg);
        }
    };

    // pass options to ajaxForm 
    $('#showProposedDate').ajaxForm(options);
}

Here's the additional functions.

 function PostMessage(message) {
    $('.message_wrap').remove();
    $("<div></div>)").addClass("message_wrap")
                 .text(message)
                 .prependTo(".grid_20");
    KillMessage();
}

function RefreshGrid() {
    $.get("/workitems/list", function (data) {
        $("#grid").replaceWith(data);
        getAvailableActions(0);
        getMoreDetails(0);
        ResetCheckbox();
        return 0;
    });
}

Each of these functions works perfectly if I place it first in the order. Any idea why I can't run them both?


Solution

  • I would guess there is an error occuring somewhere.. Try this to determine.

     function ShowProposedDate_Submit() {
        // prepare Options Object 
        var options = {
            dataType: 'json',
            success: function (responseText) {
                $("#blankModal").dialog("close");
                try { RefreshGrid(); } catch ( err ) { alert("Error: " + err); }
                try { PostMessage(responseText.msg); } catch ( err ) { alert("Error2: " + err); }
    
    
    
            },
            error: function (responseText) {
                $("#feedback").html(responseText.msg);
            }
        };
    
        // pass options to ajaxForm 
        $('#showProposedDate').ajaxForm(options);
    }