Alert, Prompt and Confirm Mehods

Section-4: Dialog Boxes
4.1 Interacting with User

In the previous section we have discussed two methods, write() and writeln(), which produces the
output to the document object.
A dynamic website needs interaction with its user to work with. A user gives the input to the website
using different way like keyboard, mouse and gets the response. Dialog box are the easiest way
using a user can interact with the website. Dialog box can provide the information to the user or
ask him to input the value requires by program.
We have seen document object methods which are used to display the content on the web page. In
the same way Window is another object which has its own methods. Window object uses dialog
boxes to interact with the user. The dialog boxes are created with three methods I.e. alert(),
prompt() and confirm(). By default, these methods do not need Window object in front of it.
Window object is top level object and there is no need to specify it while method is called
4.2 Alert () Dialog Box

 This dialog box is used to display the warning message to the user. When user enter an incorrect
information then developer use alert box to display the warning or error to the user
 It contains the small triangle icon, a customize message for user and ok button
When this dialog box appears then all the execution is stooped and wait for the user to press the ok
button
.  It is also used for the debugging purpose to check whether program is executing in the order
desired by producing the output.
 Appearance of alert() box depends upon the browser to browser
 It can display valid expression, string, variable value which are passed as a argument to the alert()
method. Following example explain the uses of alert() method.
<!DOCTYPE>
<html>
<head><title>Dialog Box</title></head>
<body>
<b>Example of alert method</b><br />
<h2>
<script type="text/javascript">
var x=10;
Var y =20;
document.write("Example of alert method ");
alert (x + y);
alert("Warning input carefully!");
</script>
</h2>
</body>
</html>
4.3 Prompt () Dialog Box
It is the one of the ways to get the input from the user using dialog box. A program generally need
input for form input, personal information etc for further processing.
 Prompt() ask the user to input the value. It has two buttons i.e. ok and cancel button
.  This method accepting two argument. First argument accepts the value in the form of question
which will be displayed on the dialog box about which input is seeking from the user.
 Second argument is optional which has the default answer of the question. If user does not input
value then second argument value will be taken as the answer. If user enter the value then second
value is override if it is passed.
 When user enter the value then it presses the ok button to confirm his input.
 Prompt() method returns the value after clicking the ok button. It returns the input value if it is
entered otherwise it returns the null value if user click on the cancel button.
Following example explain the uses of prompt() method
<!DOCTYPE>
<html>
<head>
<title>Example of prompt box</title>
</head>
<body>
<script type = "text/javascript">
var age=prompt("Tell me your age.", " 17");

if ( age == null){ // If user clicks the Cancel button
alert("Not input from user");
Else if(age < 18)
alert(“You are not so young now”);
else{
alert(age + " is adult stage");
</script>
</body></html>
4.4 Confirm () Dialog Box
This method is used to get confirmation from the user about its action to be completed. For
example, if user want to delete something, cancel the order on online websites etc., then a
dialog box is appeared to ask the user about the confirmation about it delete operations or
cancel the order.
 Confirm method display the dialog box with question mark icon, question and two buttons
ok and cancel button
.  It returns the value based on the clicked button.
 It takes the one argument i.e. question to ask from the user.
 If user click the ok button then it returns the true value
 If user click on the cancel button then it returns the false value.
Following example explain the uses of confirm() method.

<!DOCTYPE>
<html>
<head>
<title> Example of confirm box </title>
</head>
<body>
<script type="text/javascript">
var ans =confirm("Are you really want to cancel the order?");
if (ans == true) {
alert("Order has been canceled!");
else{
alert("WOW! You have change the mind ");
</script>
</body>
</html>
Answer the following questions

Q.1: What is a dialog box?
Q.2: What is Window object?
Q.3: What is alert () method?
Q.4: What is prompt () method?
Q.5: What is confirm method ()?
Q. 6: What happens when user click the cancel button of prompt dialog box?
Q. 7: What is the difference between confirm and alert method?
Q. 8: Why you don’t specify the name of the object with these methods
. Q. 9: When you would use the confirm () dialog box
Q. 10. Fill in the blanks

(a) A (n) __________ object is created for each window that appears on the screen.
(b) The __________ method pops up a message to the viewer, and the viewer has to click anOK
button to continue.
c) The prompt () method is used to __________ the viewer to enter information.
(d) Second argument in prompt method is _____________

Alert, Prompt and Confirm Mehods

Uploaded by

Copyright:

Available Formats

Alert, Prompt and Confirm Mehods

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Alert, Prompt and Confirm Mehods

Uploaded by

Copyright:

Available Formats

Section-4: Dialog Boxes

4.1 Interacting with User

4.2 Alert () Dialog Box

 Appearance of alert() box depends upon the browser to browser

<b>Example of alert method</b><br />

document.write("Example of alert method ");

alert("Warning input carefully!");

4.3 Prompt () Dialog Box

Following example explain the uses of prompt() method

<title>Example of prompt box</title>

<script type = "text/javascript">

var age=prompt("Tell me your age.", " 17");

alert("Not input from user");

Else if(age < 18)

alert(“You are not so young now”);

alert(age + " is adult stage");

4.4 Confirm () Dialog Box

Following example explain the uses of confirm() method.

<title> Example of confirm box </title>

alert("Order has been canceled!");

alert("WOW! You have change the mind ");

Answer the following questions

Q.2: What is Window object?

Q.3: What is alert () method?

Q.4: What is prompt () method?

Q.5: What is confirm method ()?

Q. 7: What is the difference between confirm and alert method?

. Q. 9: When you would use the confirm () dialog box

Q. 10. Fill in the blanks

c) The prompt () method is used to __________ the viewer to enter information.

(d) Second argument in prompt method is _____________

You might also like