Previous Page
Next Page

Confirming a User's Choice

While it's useful to give information to a user, sometimes you'll want to also get information back in return. Script 2.7 shows how to find out if the user accepts or rejects your question. This script also introduces the idea of conditionals, which is where the script poses a test and performs different actions depending on the results of the test.

Script 2.7. You can alter a reply, depending on how the user reacts to a prompt.

if (confirm("Are you sure you want to do that?")) {
     alert("You said yes");
}
else {
     alert("You said no");
}

More about conditionals

Conditionals break down into three parts: the if section where we do our test; the then section, where we put the part of the script we want to do if the result is true; and an optional else section, which contains the part of the script we want to have happen if the result of the test is not true. The contents of what we're testing in the if section are in parentheses, and the contents of the other two sections are each contained in braces.

To confirm a choice:

1.
if (confirm("Are you sure you want to do that?")) {

The confirm() method takes one parameter (the question we want to ask the user) and returns either true or false, depending on the user's response.

2.
alert("You said yes");

As shown in Figure 2.4, if the user clicked the OK button, confirm() returns true, and an alert displays, saying "You said yes". As you can see, this is the then section of the code, even though there's no then operator in JavaScript. The braces serve as the delineation of the then area.

Figure 2.4. You can capture the result of a user's action and confirm the result in an alert box, as seen here. The top image asks the user a question, and the result of pressing the OK or Cancel button is shown below.


3.
}

This brace ends the part that occurs when confirm() returned a value of true.

4.
else {

Here, we begin the section that only happens when the user hits the Cancel button.

5.
alert("You said no");

If the user clicked the Cancel button, confirm() returns false, and the message "You said no" is displayed.

6.
}

This curly brace ends the entire if/else conditional statement.

Tip

  • You can put as many statements as you wish inside the then and else braces.


There's No One Right Way

There are, literally, a million ways to write any given script and still have it work correctly. For instance, braces are not required on conditionals if (and only if) there is only one command in that code block.

In addition, there's an alternate method of writing a conditional that takes the form:

(condition) ? truePart : falsePart;

which is the rough equivalent of:

if (condition) {
        truePart;
}
else {
        falsePart;
}

That same shorthand method can also be used to set variables; for instance:

myNewVariable = (condition) ?
trueValue : falseValue;

is equivalent to:

if (condition) {
        myNewVariable = trueValue;
}
else {
        myNewVariable = falseValue;
}

There's also no requirement that the braces have to be at the end or beginning of lines, or that the true and false code blocks need to be indented. It's all a matter of style, and the correct style to use is the one you've found to work best for you.

In this book, for the most part and for clarity's sake, we've included the braces in the examples and chosen to use the longer form for conditionals.



Previous Page
Next Page