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
Different types of dialog boxes in JavaScript
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.
1 2 3 4 5 6 7 8 9 | <!DOCTYPE html> <html> <title>Alert Dialog Box</title> <head></head> <body> <script language="javascript"> alert("Hi Clue Meidator!"); </script> </body> |
Output:
2. Confirmation dialog box
The confirm() dialog box is used to get a confirmation for specific user action.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <!DOCTYPE html> <html> <title>Confirm Dialog Box</title> <head></head> <body> <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> </body> </html> |
Output:
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.
1 2 3 4 5 6 7 8 9 10 11 12 13 | <!DOCTYPE html> <html> <title>Prompt Dialog Box</title> <head></head> <body> <script language="javascript"> var name = prompt("Welcome to Clue Mediator, Enter Your Name:"); </script> </body> </html> |
Output:
We can also pass the default value in the input field as a second parameter of the prompt dialog.
1 | 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..!! 🙂
In it something is. Clearly, thanks for the help in this question.