How to Show Pop Up Boxes Using JavaScript?

Using JavaScript you can create three kinds of pop-up boxes, Alert box, Confirm box and prompt box.

Alert Box

An alert box is used if you want to make sure information comes through to the user. When an alert box pops up, the user will have to click on "OK" to processed.

Syntax:

alert("Alert Text")

Example:

<html>

<head>

function display_alert()

{

alert("This is an alert box!")

}

</script>

</head>

<body>

</body>

</html>

Preview:

Conform box

A conform box is used if you want the user to verify or accept something. When a conform box pops up, the user will have to click either "OK" or "Cancel" to processed. If the user clicks "OK" the box returns true. If the user clicks "Cancel", the box returns false.

Syntax:

confirm{"Conform Text")

Example:

<html>

<head>

function display_conform(){

r=confirm("Press a button");
if (r===true)
{
alert("You pressed OK!");
}
else
alert("You pressed Cancel");
}

</script>

<body>

</body>

</html>

Preview:

Prompt Box

A prompt box is used if you want the user to input a value before entering a page. When a prompt box pops up, the user will have to click "OK" or "Cancel" to processed entering in input value.

If the use clicks "OK" the box returns the input value. If the user clicks "Cancel" the box returns null.

Syntax:

prompt{"sometext", "defaultvalue"}

Example:

<html>

<head>

function display_prompt(){
name=prompt("Please enter your name", "Your Name");
if ((name!=null) && name!=" ")
{
alert("Hello "+name+"! How are you today?");
}
}

</script>

</head>

</body>

</html>