The basics of if-else statements

This section will introduce the logic of if-else statements in general to beginners in programming. If you have some experience in programming you can skip this section.

After reading this section you will have knowledge of the basics of if-else statements.

We will create a simple web page with two radiobuttons and a regular button that will let you choose to display the text "Hello World!" in different styles. The example is rather meaningless in real life but is good to introduce you to the basics of if-else statements.

The basics

When programming you often want to control the order in which the statements will be executed. This is done by using Control Flow Statements, and some of those are the if-else statements.

The if-else statements enable your program to selectively execute other statements, based on some criteria. The simplest version, the if statement, is shown below. The block governed by if (delimited with '{' and '}') is executed if the expression is true, otherwise the execution continues after the last '}'.

if (expressions)
{
  statement(s)
}

If you want to execute other statements when the expression is false, you use the else statement.

if (expression)
{
  statement(s) executed if expression is true
}
else
{
  statement(s) executed if expression is false
}

Another statement, elseif, executes statements if an earlier if expression was false and it's own expression is true; elseif is used to form chains of conditions. If expression 1 is true, the if block executes and then the program jumps to the last '}' of the else block. Expression 2 will never be evaluated. If, however, expression 1 is false, expression 2 will be evaluated and the elseif-else will work as a regular if-else as shown above.

if (expr 1)
{
  statement(s) executed if expr 1 is true
}
elseif (expr 2)
{
  statement(s) executed if expr 1 is false and expr 2 is true
}
else
{
  statement(s) executed if expr 1 is false and expr 2 is false
}

A basic example

Let's do something real to examplify what have been mentioned so far. We will create a simple HTML page containing RXML (Roxen Macro Language) that will be rather meaningless except for demonstrating the basics of if and else. The file will show the text "Hello World!" either in plain text or bold text, depending on which radiobutton is checked by the user. Here is the code followed by screenshots of the output in a browser:

<html>
 <head>
  <style type='text/css'>
  <!--
    body{background-color:#FEFEC9}
    h1{background-color:#FEED87}
  -->
  </style>
 </head>

 <body>

 <!-- HTML FORM -->

 <h1>A basic example>/h1>

 <p>Check radiobutton and click &quot;OK&quot; for bold.</p>

 <form action='hello_world.html' method='GET'>
   <input type='radio' name='style' value='plain' />
     &nbsp;Plain style <br />
   <input type='radio' name='style' value='bold' />
     &nbsp;Bold style <br />
   <input type='submit' value='OK' />
 </form>

 <p>------------------------</p>

 <!-- RXML CODE -->

 <if variable='form.style is bold'>
   <p><b>Hello World!</b></p>
 </if>
 <else>
   <p>Hello World!</p>
 </else>

 </body>
</html>

The page in the browser before any interaction.

The user chooses 'Bold style', clicks OK...

...and the text goes bold.

The interesting part of the code is the  section. We want to check if the user chose bold or not. When the user clicks the OK button, the variable style will contain either the string 'bold' or the string 'plain' (or perhaps be empty, if something goes wrong). We use an if-else statement to check which. If style contains 'bold', the expression variable='form.style is bold' will be true, the line inside if executes and 'Hello World!' will be bold. If style doesn't contain 'bold', the expression will be false and the line inside else will execute; 'Hello World!' will be plain text.

<!-- RXML CODE -->

<if variable='form.style is bold'>
  <p><b>Hello World!</b></p>
</if>
<else>
  <p>Hello World!</p>
</else>

Let us add the possibility to make the text italic. We insert the lines:

<input type='radio' name='style' value='italic' />
 &nbsp;Italic style <br />

below the second <input> and rewrites the RXML part to

<if variable='form.style is bold'>
  <p><b>Hello World!</b></p>
</if>
<elseif variable='form.style is italic'>
  <p><i>Hello World!</i></p>
</elseif>
<else>
  <p>Hello World!</p>
</else>

This gives us the following result:

Now the user has three options.

As you might have guessed, this is an example of the if-elseif-else statement. If style contains 'bold', the if tag executes, if it contains 'italic', elseif executes and in all other cases, else executes.

Summary

This section has taught you the basics of the if-else statements in general. If-else statements is used to control the flow of a program. The if statement test a condition and if the condition is true, the if statement block will execute. The else statement will execute if an if condition is not true. The elseif statement is used to form chains of conditions.

More details about if-else statements and other control flow statements are found in any book or on any site that is teaching programming. However, the information in this Section should be enough to take you through the rest of this Lesson.

The next section, The syntax of If tags will introduce the RXML If tags, including tags, attributes and operators.