Dialog Classes Revisited

So, how 'bout them pop-up blockers? Recently, one of the projects I am working on ran into an interesting problem. Pop-up blockers were blocking our dialog boxes. These were perfectly valid, user initiated dialogs. The problem, however, is that the google toolbar (and others) seems to think that if you post back before popping up a dialog, then the dialog that you pop must be an advertisement. Of course, users tend to be too ignorant to know what is going on, so they keep clicking and clicking and nothing ever happens. So, we had to come up with a solution for this. The two requirements were:

1: It has to be a clean solution (no complex, ugly hacks in our code when we can avoid them)
2: It had to support postbacks

Yes, we technically could have eliminated postbacks in most places, but it would have violated #1 to start off with, since we would be doing a lot of extra client side script generation and would be breaking the ASP.NET model (not to mention that it would be too time consuming now that most of the code has already been written, tested and debugged, and the deadlines are yesterday.

So, here is a simplified example of the solution that I came up with that works great so far. Write something like this and insert into your page with a RegisterClientScriptBlock or RegisterStartupScript call: 

//----------------------------
function __openDialog()
{
     return window.open(...); // open dialog window, return handle
}

function __openDialogOrDisplayWarning()
{
    var hWindow = __openDialog();
    if(hWindow == null)
    {
        // window was not opened
        document.body.innerHTML += "<div style='position: absolute;...'>You have a !@$@!$^ popup blocker installed that has prevented this document from launching automatically. To prevent seeing this message in the future, disable your popup blocker, or hold down ctrl while launching the document. <input type='submit' value='Launch' onClick="__openDialog"></div>";
    }
}

window.attachEvent("onload", __openDialogOrDisplayWarning);
//----------------------------

Now, there are a few important points here:

1) only user initiated popups (via js onclick) will be allowed through popup blockers
2) if you do not use a handler and attach to onLoad, then there is a chance that the code will execute before the page is loaded, causing a nasty IE error that redirects to a blank page.
3) it looks nicer if you spend some time on the div and make it look like a IE dialog box or something

Yah, in a perfect world we wouldn't need to do something lame like this, but the world just ain't perfect, is it?

No Comments