JavaScript Popup Boxes – Alert, Prompt and Confirm.

 

JavaScript mainly have the three popup boxes:

1. Alert popup box
2. Prompt popup box
3. Confirm popup box

Alert

JavaScript alert popup box is the type of “modal” popup box. It means alert popup box stop the execution until user or visitor clicks on the “Ok” button. Alert popup box display the message that we want to display to the user.

Alert method is derived from the JavaScript’s “window” class, We can display the Alert popup box in two ways.

 

window.alert("Hello world!!!");

 

or

 

alert("Hello world!!!");

 

Confirm

 

Confirm box is also the modal type of popup box. It is useful when you wants the user must be verify the details or for verification of something like agree or disagree something. Like you want to display the verification message before deleting the records.

 

It display the “message” that we want to display to the user with the Cancel & Okay button. Confirm box also returns the Boolean value that indicates the user either clicks the Okay or Cancel button.

 

If it return the “true” means user clicks on the “OK” button, If it returns the “false” means user clicks on the “Cancel” button.

 

var result=confirm("Do you want to delete this data?");
if(result==true)
{
alert("You click the OK button");
}
else
{
alert("You click the Cancel button");
}

 

Prompt

 

Prompt box is useful to take the information or data from the user. It display the popup box with the text message, “Text box” and “Okay & Cancel” button.

 

It will returns the String that user enters into the text box or it will returns the null if user does not enter anything.

 

Prompt box accept the two arguments, First argument is the message that will be displayed on the popup box and Second argument is default value if user does not enter anything it will return the default value. Second argument is optional, If you can not supply the second argument than it will return the null value when user does not enter anything. It is better to supply the second argument because the IE browser return the “undefined” when user does not enter anything.

 

var yourName=prompt("Enter your name: ","Name");
if(yourName==="Name")
{
alert("You does not enter anything!!!");
}
else
{
alert("Your name is: "+yourName);
}

 

Happy Coding. 🙂