Question

Below is my code for displaying a pop up window when the user clicks on an image link:

Javasript

  function plusbutton(mylink, windowname)
    {
    if (! window.focus)return true;
    var href;
    if (typeof(mylink) == 'string')
       href=mylink;
    else
       href=mylink.href;
    window.open(href, windowname, 'width=800,height=550,scrollbars=yes');
    return false;
}

HTML

<a href="previousquestions.php" onclick="return plusbutton(this, 'previousquestions');">
<image src="Images/plussign.jpg" width="30" height="30" alt="Look Up Previous Question" class="plusimage"/>
</a>

My question is that when the user opens up the window, then when the user clicks away from the window, the window minimizes. I don’t want this to happen. If the user clicks away from the window, then it should still display the window.

It is like when you click on “Save As” on Microsfot Word, when the “Save As” window appears, if you click of it, the window still appears, stating that you must either Save the document or Cancel the Save As before being able to do anything else on the document. I want the same this to happen with the pop up window above, how can this be achieved?

Thanks

Answer 1

What you are trying to do is called a “Modal Window”, and it is not possible to achieve this goal with a browser window. In fact, you can not even guarantee that it’s a window: some browsers would in some cases just open a new tab.

What you should do is open a window with pure HTML within you application. Some librarie allow you to do this easily: jQuery UI dialog for example. Check out http://jqueryui.com/demos/dialog/#modal

If all your architecture bounds your popup content to be delivered by a separate URL, you can do one of the following things:

• Either put and iframe in the popup (easy but dirty)
• Or retrieve the HTML content with an XMLHttpRequest and use it to define the content of the popup. Maybe a little more tricky, but cleaner.