Alex Rivera | Logout

Popup blocked when created in jQuery ajax success callback

Asked 2009-07-06T12:21:03.057
13

Google Chrome seems to be blocking a popup I am creating via jQuery. After some investigation, it appears to be an issue with calling window.open in the success event of an ajax call. Is there a way around this? My jQuery ajax call returns the URL to be opened. So I am bit stuck.

It works if I place the window.open outside the ajax call; but, inside (i.e. in the success event) it is blocked. I think it is something to do with CONTEXT but I am unsure.

Here is what I have:

     window.open("https://www.myurl.com");  // OUTSIDE OF AJAX - no problems 
                                            // with popup

     $.ajax({
        type: "POST",
        url: "MyService.aspx/ConstructUrl",
        data: jsonData,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            // Normally loads msg.d which is the url returned from service
            // static url below is for testing
            window.open("https://www.myurl.com");  // THIS IS BLOCKED
        },
        error: function(msg) {
            // alert(error);
        }
    });
Edit
Report

1 Answer

7

Your code returns these in firefox and chrome:

Firefox: "Firefox prevented this site from opening a pop-up window." Chrome: "Pop-up blocked"

To fix this issue just add async:false to your ajax call.

$.ajax({
type: "POST",
async: false,
url: "MyService.aspx/ConstructUrl",
data: jsonData,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(url) {
    window.open(url); 
},
error: function(msg) {
    //alert(error);
}

});

Just be careful that async:false will force javascript to wait for jQuery ajax result. It means it freezes javascript until ajax call is completed.

answered 2013-02-07T01:07:38.283

Your Answer