PC SOFT

WINDEVWEBDEV AND WINDEV MOBILE
ONLINE HELP

Home | Sign in | English UK
New WEBDEV 24 feature!
  • This lesson will teach you the following concepts
  • Overview
  • The IF and SWITCH statements
  • The IF statement
  • The SWITCH statement
  • Practical example: Using the IF and SWITCH statements
  • Project used
  • Creating the page
  • Creating the page controls for the conditional IF statement
  • Conditional IF statement
  • Creating the page controls for the conditional SWITCH statement
  • SWITCH statement
Appendix 3. The conditional statements
This lesson will teach you the following concepts
  • The IF statement.
  • The SWITCH statement.
  • Practical example.

Estimated time: 30 mn
Previous LessonTable of contentsNext Lesson
Overview
WLanguage is a set of statements used to handle data.
The conditional statements are used to compare variables and/or values between themselves in order to perform different processes. Several conditional statements are available:
  • IF... THEN... ELSE... END
  • SWITCH...
The IF and SWITCH statements

The IF statement

This statement is used to run an action or another one according to the result of an expression. If the expression is checked, a process is run ; if the expression is not checked, another process can be started.
The IF statement can be used as follows:
IF <Expression to check> THEN
  Process to run if the expression is checked
ELSE
  Process to run otherwise
END
Code example: The following code selects a number at random and displays a message according to the value.
Tot is currency
// Selects a number at random between 100 and 4000
Tot = Random(100, 4000)
IF Tot>2000 THEN
Info("The amount is greater than 2000")
ELSE
Info("The amount is less than or equal to 2000")
END
In this case, the expression to check corresponds to "Tot>2000".
Note: Several code lines can be run during the process corresponding to a condition. In this case, the following syntax must be used:
IF <Expression to check> THEN
Code line 1
Code line N
ELSE
Code line 1
Code line N
END

The SWITCH statement

This statement is used to evaluate an expression and to run a process for each possible expression value.
The SWITCH statement can be used as follows:
SWITCH <Expression>
CASE Value 1:
Process 1...
CASE Value 2:
Process 2...
...
CASE Value N:
Process N...

OTHER CASE
Process ...
END
Example: The following code retrieves today's date and displays a different message according to its value. A specific message is displayed for the 1st and for the 15th of the month. In the other cases, today's date is displayed.
D is Date
D = Today()
SWITCH D..Day // Checks the day of the date
CASE 1: Info("We are the first day of the month")
CASE 15: Info("We are the 15th of the month")
OTHER CASE:
Info("We are the: " + DateToString(D))
END
Notes:
  • If the code line "CASE 1:..." is run, the other code lines corresponding to the possible values are not run.
  • Several values can be grouped in the same case. The different values are separated by a comma. For example:
    Sub is int = 2
    SWITCH Sub
           CASE 1,2: Info("Case 1 or 2")
           CASE 3: Info("Case 3")
           OTHER CASE: Info("Other case")        
    END
  • Several code lines can be run during the process corresponding to an expression value. In this case, the following syntax must be used:
    SWITCH <Expression>
    CASE Value 1:
    Process 1 - Code line 1...
    Process 1 - Code line 2...
    CASE Value N:
    Process N - Code line 1...
    Process N - Code line 2...
    OTHER CASE
    Process ...
    END
Practical example: Using the IF and SWITCH statements
To use the conditional instructions we have just studied, we will create the following page:
Two operations can be performed:
  • If the user clicks the check box, the "Close" button is displayed.
  • If the user clicks the "Test" button, the box checked in the check box is displayed.

Project used

To handle the different concepts of this lesson, we are going to create different pages. These pages will be created in the "My_First_Pages" project.
  • Open the "My_First_Pages" project if necessary.
    1. Display the WEBDEV home page (Ctrl + <).
    2. Click "Tutorial" and select the project named "My first pages (Exercise)".

Creating the page

  • Create a new blank page:
    1. Click among the quick access buttons. The window for creating a new element is displayed: click "Page" then "Page". The wizard for page creation is displayed.
    2. Select "Blank".
    3. Make sure that "Responsive Web Design mode" is unchecked.
    4. Validate. The page is automatically created in the editor. The window for saving an element is displayed.
    5. Specify the page title: "Conditional statements". The page name ("WIN_Conditional_statements") is automatically proposed.
    6. Click on the green button to validate the information displayed in the save window.

Creating the page controls for the conditional IF statement

Two controls must be created:
  • a Check Box control used to display (or not) the "Close" button.
  • a "Close" button used to close the browser window.
  • To create the Check Box control:
    1. On the "Creation" pane, in the "Usual controls" group, click "Check Box" then click the position where the control will be created (at the top of the page for example)
    2. Click the control that was just created: the "Option 1" caption becomes editable.
    3. Type the option caption: "Make the closing button visible".
    4. Press Enter to validate the input.
  • To create the "Close" button:
    1. On the "Creation" pane, in the "Usual controls" group, click .
    2. Click the location where the button will be created (below the Check Box control for example).
    3. Click the button that was just created. The text displayed in the button becomes editable. Type the caption: "Close".
    4. Press Enter to validate the input.
  • This button is used to close the browser window. We are going to type the corresponding WLanguage code:
    1. Select the "Close" button.
    2. Press the F2 key: the code editor displays the events associated with the button.
    3. Write the following code in the event "Click on BTN_Close (browser code)":
      BrowserClose()
      BrowserClose is used to close the current window of Internet browser.
    4. Close the code editor.
  • The "Close" button must be invisible when opening the page. This information corresponds to its "initial status". We are going to modify this status in the description window of control:
    1. Select the "Close" button.
    2. Display the popup menu of control and select "Description".
    3. In the "GUI" tab, modify the initial status of control by clicking "Visible". This option is now unchecked.
    4. Validate the description window of control.
    5. The "Close" button is still visible in the editor. Its status was changed in execution only.
    6. Save the modifications by clicking among the quick access button (on the left of ribbon) or by pressing Ctrl + S.

Conditional IF statement

In our example, a click on the check box must trigger the display of Close button.
We are going to type the WLanguage code associated with the check box.
  • To type the WLanguage code associated with the Check Box control:
    1. Select the Check Box control.
    2. Press the F2 key.
    3. Write the following code in the event "Exit with modification of CBOX_NoName1 (browser code)":
      IF CBOX_NoName1 = True THEN
      BTN_Close..Visible = True
      ELSE
      BTN_Close..Visible = False
      END

      Let's study this code:
      • CBOX_NoName1 and BTN_Close respectively correspond to the names of Check Box and Button controls.

        Tip

        To handle the current control in one of the events associated with it, you can use the keyword MySelf.
        In our example, you also have the ability to write:
        IF MySelf = True THEN
      • The Check Box control is a 2-state control: checked/unchecked. It corresponds in programming to a Boolean variable. If the control is checked, its value is set to True ; if the control is unchecked, its value is set to False.
      • This code checks the value of check box.
        • If the check box is checked, the BTN_Close button becomes visible via the WLanguage ..Visible property.
        • If the check box is unchecked, the BTN_Close button becomes invisible.

Note

Several functions and properties are available in WLanguage. The functions can accept parameters and they return results. The properties are directly applied to the controls via the following syntax:
<Control name>..<Property name>
In our example, ..Visible is used on the BTN_Close control.
The online help of a function or property can be displayed at any time by pressing F1. See How to access the online help? for more details.
  • Let's now run the page test:
    1. Click among the quick access buttons (or press F9).
    2. In the page in execution, click the check box. The "Close" button becomes visible.
    3. Click the "Close" button: the browser tab is closed and the page editor is displayed.

Note

Depending on your browser configuration, a window may appear asking for confirmation to close the browser.

Creating the page controls for the conditional SWITCH statement

Two controls must be created:
  • a Radio Button control used to select the value to check.
  • a Button control used to run the test.
  • To create the Radio Button control:
    1. On the "Creation" pane, in the "Usual controls" group, click "Radio button".
    2. Click inside the page to create the control (on the right of the Check Box control created beforehand for example).
    3. Display the popup menu of the control (right mouse click) and select "Description".
    4. In the "Content" tab, add two new options by clicking the button .
    5. Specify the captions for the different options:
      • "Option 1" becomes "Mr".
      • "Option 2" becomes "Mrs".
      • "Option 3" becomes "Miss".
      • "Option 4" becomes "Other".
    6. Validate the description window of Radio Button control (green button).
  • To create the "Test" button:
    1. On the "Creation" pane, in the "Usual controls" group, click .
    2. Click the location where the button will be created (below the Radio Button control for example).
    3. Click the button that was just created. The text displayed in the button becomes editable. Type the caption: "Test".
    4. Press Enter to validate the input.

SWITCH statement

In our example, the Test button is used to check the selected value and to display a message.
  • We will enter the WLanguage code associated with the Test button:
    1. Select Test button.
    2. Press the F2 key.
    3. Write the following code in the event "Click on BTN_Test (Server code)":
      SWITCH RADIO_NoName1
    4. When pressing the Enter key to go to the next line, the code editor automatically displays the different SWITCH capabilities:
    5. Write the following code:
      SWITCH RADIO_NoName1
      // Mr
      CASE 1
      Info("You've selected Mr")
      // Mrs
      CASE 2
      Info("You've selected Mrs")
      // Miss
      CASE 3
      Info("You've selected Miss")
      // Other
      CASE 4
      Info("You've selected Other")
      END

      Let's study this code:
      • RADIO_NoName1 corresponds to the name of Radio Button control.
      • The Radio Button control is a control proposing several options (4 in our case). A single option can be checked at a time. The Radio Button control corresponds in programming to an Integer variable. Each menu option is associated with a value. If this option is checked, the Radio Button control takes for value the identifier of checked option.
      • This code checks the value of radio button. A message is displayed according to the value of radio button.
  • Let's now run the page test:
    1. Click among the quick access buttons (or press F9).
    2. In the page whose test is run, select an option and click "Test": the message corresponding to the selected option is displayed.
    3. Close the browser.
Previous LessonTable of contentsNext Lesson
Minimum version required
  • Version 24
Comments
Click [Add] to post a comment