Question

I am loading content into a bootstrap modal dialog via jquery. (I am using bootbox addon for dynamic modal dialog creation)

$.ajax({
        url: "create.cshtml",
        dataType: 'html',
        success: function (data, textStatus, jqXHR)
        {
            bootbox.dialog(data);
        },
        error: function (jqXHR, textStatus, errorThrown)
        {
            HandleError(textStatus, errorThrown);
        }
    });

Now this all works fine.

But what I want to do is show the fade in background while I wait for the aync call to complete so the user can see it’s loading. I can’t see anything in the docs about showing the modal background but I presume there must be a way to trigger it before I perform the async call.

Anyone have any ideas?

Answer 1

You could do this:

$("YOUR_BACKGROUND").fadeIn("slow", function(){

//MAKE YOUR AJAX CALL HERE

});