Javascript : Create Pop-Up Window Generating From JSP

There are several methods for creating PopUp Window. Some of them are explained below.


Window createPopup() Method


Definition and Usage

The createPopup() method is used to create a pop-up window.

Syntax 

window.createPopup()

Drawback

This method of generating PopUp only works with INTERNET EXPLORER..!!!

Method window.open()

The code to open a new window is straightforward. It gets more complicated when you add different options, and when you navigate around multiple windows.



Open Window 1

The statement used to open basic popup for Example 1 is: 

window.open("www.freekatta.blogspot.com","Window1","menubar=no,width=430,height=360,toolbar=no");

In the above example, the syntax is to first specify the web page to load into the window. Next, set the title of the window. Last, specify the options for the window. Note: the options are all in a single set of quotes. 

The code to close the popup is:

<a href="javascript:self.close()">close window</a>

This example also demonstrates how to create a link that closes the popup.

The parameters for window.open() are as

Option	Values	Description	Version
location	yes|no	Does the location bar show?	ver 1.0
menubar	yes|no	Does the menubar show?	ver 1.0
scrollbars	yes|no	Do scrollbars show?	ver 1.0
status	yes|no	Does the status bar show|	ver 1.0
titlebar	yes|no	Does the titlebar show?	ver 1.0
toolbar	yes|no	Does the toolbar show?	ver 1.0
resizable	yes|no	Can you resize the window?	ver 1.0
height	pixels	height of window	ver 1.0
width	pixels	width of window	ver 1.0
directories	yes|no	Does the personal toolbar show?	ver 1.2
innerHeight	pixels	specifies the inner height of window	ver 1.2
innerWidth	pixels	specifies the inner width of window	ver 1.2
screenX	pixels	specifies distance from left edge of screen	ver 1.2
screenY	pixels	specifies distance from top edge of screen	ver 1.2

window.showModalDialog() Method

In JavaScript, showModalDialog()  method creates a simple modal dialog box which is a simple html page but when a modal dialog opens, user can't switch to another page until it closes the modal dialog box.

Syntax:

window.showModalDialog("URL"[, arguments[, "features"]])

Where url is the URL of page which is to be opened in modal window and arguments are those arguments which we are passing to the modal window and feature options are the attributes set for the modal window.

Suppose we have an image file and we want to view that particular image file into a separate modal window. It is an example of situation where we need modal window. To illustrate showModalDilaog()method we have created two HTML pages. In the first page we have placed an image and we will pass that image as an argument to the modal window. When we will click on the image it calls the functionshowModalWindow().

Download Example Code

Happy Coding..