Dialog boxes in JavaScript

In this article, you will learn the different types of dialog boxes in JavaScript. The dialog boxes are mostly used to show an alert message, get user confirmation, get user input.

Checkout more articles on JavaScript

• How to get all cookies using JavaScript
• How to remove HTML tags from a string using JavaScript
• Download a file using JavaScript
• How to get the window size in JavaScript

Different types of dialog boxes in JavaScript

1. Alert dialog box
2. Confirmation dialog box
3. Prompt dialog box

1. Alert dialog box

The `alert()` method is used to display an alert box with a message. The dialog box will block the browser until you click the OK button.

<title>Alert Dialog Box</title>


  <script language="javascript">
    alert("Hi Clue Meidator!");
  </script>

Output:

Alert Box - Clue Mediator

2. Confirmation dialog box

The `confirm()` dialog box is used to get a confirmation for specific user action.

<title>Confirm Dialog Box</title>


  <script language="javascript">
    var result = confirm("Are you sure you want to delete this record?");
    if (result == true) {
      // OK button Clicked!
    }
    else {
      // Cancel button Clicked!
    }
  </script>

Output:

Confirm Box - Clue Mediator

3. Prompt dialog box

The `prompt()` dialog box that can get the input from the user. This will return the `null` value when you click on the Cancel button.

<title>Prompt Dialog Box</title>




  <script language="javascript">
    var name = prompt("Welcome to Clue Mediator, Enter Your Name:");
  </script>

Output:

Prompt Box - Clue Mediator

We can also pass the default value in the input field as a second parameter of the prompt dialog.

var name = prompt("Welcome to Clue Mediator, Enter Your Name:", "Default Value");

I hope you find this article helpful.
Thank you for reading. Happy Coding..!! 🙂