Javascript Programming

Alert, prompt and confirm

alert - this is a small window that contains a message but this is a modal window. A modal window is a window where it stops you from interacting with the whole page and would make sure that you press okay signifying that you receive the message.

==================

let message = alert("Hello World");

=================

HTML

document.write(message);

Result:

undefined

Note:  Hello World will be displayed in a small alert window. You have to press okay. And in the document's body will displayed undefined. If you did not type in anything in the script element in the html, it will still display the alert since the javascript was called in the head element in your html.

prompt - this is a small window that needs two parameters.

    prompt(title, [optional]);

    The title works as display to give you a hint on what to put on the input field. Yes, under the title, there is an input field where the value you put in the optional will be displayed. You can change this value or put nothing on it. If there is no value and you press ok, then an empty space will be displayed but if you cancel, then it will display a null.

=================

let yourQuestion = "What is your name?";

let yourAnswer = "Bell Cranel";

let yourPrompt = prompt(yourQuestion, yourAnswer);

function getPrompt(){

     return yourPrompt;

}

=================

HTML

document.write(getPrompt())

Result:

Bell Cranel

Note: A small window with a title What is your name? will be displayed and under it will displayed the initial value Bell Cranel. If you did not change the value and just press ok, Bell Cranel will be displayed but if you did change it, then whatever you input in there will be displayed. If you cancel, a null will be displayed.

confirm - this is a small window that needs a single parameter.

     confirm(title);

     The title here works the same way in the prompt but this time there will be no input field. It will rely on the ok and cancel button for the reply. The ok button will pass in true while the cancel button will pass in false.

===============

let yourQuestion = "Is your name John Doe?";

let yourConfirmation = confirm(yourQuestion);

function getConfirmation(){

     return yourConfirmation;

}

===============

HTML

document.write(getConfirmation())

Result:

true

Note: If you press okay, true will be displayed if cancel, false will be displayed.