System dialogs with JavaScript BOM

A browser invokes system dialogs to display message or messages to users. These dialogs are synchronous and modal, i.e. JavaScript code stops executing till user dismisses them. The system dialogs used in JavaSript are described below.

Alert Box

The alert box is the simplest one of system dialogs. It may be used to alert user on incorrect information in forms, to display warning on service expiry, to display invalid result from a calculation …and so on. When an alert box pops up the OK button has to be pressed to proceed; thus, it makes the user going through the information it displayed. This method is part of a window object described in details here.

Syntax

window.alert(“display message”);

alert(“display message”);

Example of an alert method in JavaScript

<!DOCTYPE html>
<html>	

<body>		
<script>
	alert("Note: Webpage loading now...");
</script>		
<p>This line is displayed after pressing OK in alert box.</p>
</body>

</html>

Confirm Box

A confirm box dialog displays a message to the user and has an OK and Cancel buttons. It allows user to confirm if an action has to be taken or not. If user clicks OK, true is returned to the script, else if Cancel or X in top corner is pressed, false is returned. This dialog box is used in applications like deleting email, closing a web-page …etc. This method is part of the window object.

Syntax

window.confirm(“display message”);

confirm (“display message”);

Example of a confirm method in JavaScript

<!DOCTYPE html>
<html>	

<body>		
<script>
    if(confirm("Select an option below")){
        document.write("You have selected <b>OK</b>");
    }
    else{
        document.write("You have clicked <b>Cancel</b>");
    }
</script>
</body>

</html>

Prompt Box

The prompts box dialog prompts an user to input data. It has an OK and Cancel buttons for the user to send the data or cancel it. If OK is pressed, the data is sent to the script, and else if Cancel or X in top right window is pressed, null is returned to the script. They are handy in applications like asking for user name, entering numbers …etc. This method also is part of the window object.

Syntax

window.prompt(“display message”);

prompt (“display message”);

Example of a prompt method in JavaScript

<!DOCTYPE html>
<html>	

<body>		
<script>
    var name = prompt("Enter your name \n Let's be friends!")
    if(name == null){
        document.write("You have not entered your name");
    }
    else{
        document.write("Hi " + name);
    }
</script>
</body>

</html>

›› go to examples ››

System dialogs with JavaScript BOM

Alert Box

Syntax

Example of an alert method in JavaScript

Confirm Box

Syntax

Example of a confirm method in JavaScript

Prompt Box

Syntax

Example of a prompt method in JavaScript

Comments

About

Contact

Get Connected