开发者

Close FancyBox Before AJAX Post

开发者 https://www.devze.com 2023-03-07 19:41 出处:网络
I have following code.I show user a fancybox and theyclick 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 unti

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

0

精彩评论

暂无评论...
验证码 换一张
取 消