JavaScript - Document Object Model - Dialogs

There are built in dialogs the window object offers. Dialogs are basically pop-ups the user will see and the one very prominent one which is used for debugging instead of console.log is the Alert.

Alert:
It is a function on the window object. It is used like this:
alert("This is an alert");

I get this window here. We can only click OK.

Confirm:
Apart from alert we have confirm function which will provide the user with two options:

• Cancel
• OK

confirm("Are you sure?");

I can also use this with console.log():

console.log(confirm("Are you sure?"));

If the user chooses OK. Then true is returned.
If the user chooses Cancel. Then false is returned.

Prompt:
The prompt dialog will provide the user with a textfield for inputting:
console.log(prompt("What is your Name ?"));

Once the user types in the answer in the textField and presses OK. The answer is returned.
We must really think before using them as there are better ways with modals - as in page pop ups.



Practice at:
http://jsbin.com

Refer:

• https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm
• https://developer.mozilla.org/en-US/docs/Web/API/Window/alert
• https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt
• https://getbootstrap.com/docs/3.3/javascript/#modals
• https://www.appcues.com/blog/67-open-source-modal-window-plugins-made-with-jquery-javascript-css-and-more