Close FancyBox Before AJAX Post

I have following code.I show user a fancybox and they click Submit on Form I close fancybox and show them processing on page and do an AJAX post using JQuery. But some how fancybox gets stays open until AJAX form post is completed.Which creates confusion for user .

   function BeginProcess(){
       $.fancybox.close();
       $("#imgProcess").attr("src", "/admin/images/loading_animation.gif");
       $('#imgProcess').show();
       PostAJAXForm();
}

function PostForm(FormData){
               $.ajax({
                type: "POST",
                url: "process_image.jsp",
                data: FormData,
                contentType: "application/x-www-form-urlencoded",
                async: false,
                success: function(response) {
                    response = $.trim(response);
                    $('#imgProcess').delay(10000).hide();
                    return response;                    
                 },
                error: function(xhr, ajaxOptions, thr开发者_C百科ownError) {
                     alert("There was an error. Please undo image and perform action again. " );
                     $('#lblProcess').delay(5000).hide();
                     return;
                   }
                });
} 

Here's a snippet:

var params = $(this).serialize();
var self = this;

$.ajax({
            type: 'POST',
            url: self.action,
            data: params,
            beforeSend: function(){
                    alert('Closing');
                    $.fancybox.close();
            },
            success: function(data){
                    alert('Finished processing form');
                    return false;
            },
            dataType: 'json'
    });

Sorry if something is messed up or left out from that snippet - but you should get the idea.

You need to add $.fancybox.close() in Jquery' Ajax's beforeSend function.

http://api.jquery.com/jQuery.ajax/ http://api.jquery.com/ajaxSend/

This should help you out too http://snipplr.com/view/47979/close-a-fancybox-when-you-submit-a-form-with-ajax