DOM Signal Boxes

DOM Windows and Related Objects – Part 10

Forward: In this part of the series, we look at DOM signaling boxes.

By: Chrysanthus Date Published: 31 Jul 2012

Introduction

This is part 10 of my series, DOM Windows and Related Objects. In this part of the series, we look at DOM signaling boxes. You display a signal using a window object method. I assume you have read the previous parts of the series; this is a continuation.

Note: If you cannot see the code or if you think anything is missing (broken link, image absent, etc.), just contact me at forchatrans@yahoo.com. That is, contact me for the slightest problem you have about what you are reading.

The alert() Method
We have seen the alert() method so many times in this volume. The syntax is,

    window.alert(message)

You can use it without the reserved word, window. It can take a string argument or a variable. The argument can also be a concatenation of strings. Read and try the following code; click the OK button to dismiss the alert box:

<!DOCTYPE HTML>
<html>
<head>
    <title>Illustration</title>
</head>
<body>
    <p>text text text</p>

    <script type="text/ECMAScript">
        window.alert('Yeah Man');
    </script>
</body>
</html>

The confirm() Method
The confirm() method displays a dialog box with a specified message. The box also has an OK and a Cancel button. If the user clicks OK, the method will return true. If the user clicks Cancel, the method will return false. The method returns after the user has clicked OK or Cancel. The syntax is:

    window.confirm(message)

You can use the method without the preceding reserved word, window. The message is a string, a variable or a concatenated string. Read and try the following code, clicking OK or Cancel in the first signal box.

<!DOCTYPE HTML>
<html>
<head>
    <title>Illustration</title>
</head>
<body>
    <p>text text text</p>

    <script type="text/ECMAScript">
        myVar = window.confirm('To proceed with the analysis, click OK');
        window.alert(myVar);
    </script>
</body>
</html>

The prompt() Method
The prompt() method displays a dialog box that prompts the user for input. The box is similar to the confirm box but has an input text control. The syntax is,

    window.prompt(msg,defaultText)

You can omit the preceding reserved word, window. There are two arguments, each of which is a string. The first argument is the message displayed indicating what kind of input the user should use. The second message is default text, proposed to the user, for him to use. The method returns only after the user has clicked OK or Cancel. The returned value is the string the user typed in. Read and try the following code:

<!DOCTYPE HTML>
<html>
<head>
    <title>Illustration</title>
</head>
<body>
    <p>text text text</p>

    <script type="text/ECMAScript">
        theVar = window.prompt("Do you like this tutorial?","Yes");
        alert(theVar);
    </script>
</body>
</html>

Note: If the user clicks Cancel for the prompt box, the value, null, would be returned. So if the user clicks OK, the value (string) he typed in is returned. If he clicks Cancel, null, is returned.

That is it for this part of the series. We stop here and continue in the next part.

Chrys

Broad Network

Related Articles

DOM Signal Boxes

DOM Windows and Related Objects – Part 10

Introduction

Related Links

Comments