Combining <if> and <define>
This section will show how to combine <if> and <define> to dynamically show contents of a web page.
After reading this section you will have knowledge of how to combine <if> and <define> when creating a web page. You will also know how to use <define> to define your own RXML macro.
We will create a web page with a HTML form requesting the name and e-mail address of a user. On submit we will check if all fields are set and if the e-mail address is valid. The page will show a response depending on the test results.
The <define> tag
A very useful tag is the Variable tag <define>. It is used for creating your own macros such as tags, containers or If-callers. The most common use is to define an 'alias' for a portion of code that will be inserted several times on a web page. We will not discuss <define> in depth here. See the Web Site Creator Manual for details.
Let's create a tag that will work as a sum of some other tags.
Here <multi-set> is used to insert the three <set> tags. If we were to do this set operation in multiple places the value of <define> is quite obvious. We can also add values via attributes to our defined tag.
The attribute values are catched with entities and using the '_' scope, representing the current scope. Here the value of the name attribute is represented by the entity &_.name;. If we want to set default values to attributes (used when the attribute is left out) we use the container <attrib>.
An interesting feature is to define a macro for an If plugin or combinations of If plugins. You simply create an alias that can be used together with <if>.
Well, that is how far we go into <define> here. In the example part below we will use the <define tag> feature to insert a HTML form with dynamic content.
Verifying an e-mail address
We are going to create a simple e-mail address checker only using HTML and RXML. The first time the page is loaded a form is presented to the user for input of name and e-mail address. A submit sends the input and when the page is loaded again, we will first check that both name and e-mail address were added, and if so, check if the e-mail address matches the form '*@*.*'. If any of the tests fail, an error message will be displayed together with the form for new input. Correct input will not be deleted. If all goes well, a nice welcome awaits the user.
The source code is found by following the link. (It might be a good idea to open the source code file in a different window, so that it is easily read parallel to this section. The code won't be displayed here to shorten the length of this section.)
First we define a RXML macro called mail-form that inserts a form. Four attributes are used: nameval, mailval, status and mess. We use <attrib> to set default values for nameval and mailval to the data entered in the field. This will save entered data so that the user won't have to retype it. The form will display a status message, an ordinary message and a form with two input fields and a submit button.
To display the page dynamically we use <if> and <else>. The first test checks if the page is loaded for the first time or if the user pushed a submit button to get there. Only if the user clicked the 'OK' button, &form.button; will represent 'OK'. The next test checks if both fields contain data. If so, var.ok will have the value 1. The last test checks if the e-mail address match the form '*@*.*'. This test is really not sufficient in real life, since an address like 'foo@email@example.com' would be correct. Remember that anything goes with '*'. It is left for you to figure out a nice algorithm for a better check. Remember, practice makes the master.
The first time the page is loaded or if the user clicked the 'Again' button we use our defined macro to display the start form.
When we are sure that the user clicked the 'OK' button, we test the data entered. We use <set> to catch the data from the two input fields and then test if any of them where empty, <if variable='var.name_ = '>. If so, we use <append> to set var.ok to 0, which will give a false result in the 'Both not emtpy' test. The form will then reappear with a message telling the user to fill in both fields.
Next we check the e-mail address. We use the Variable plugin although it looks like a typical Match test. This is done to avoid the problem with whitespaces when doing a Match. (See If plugins section, Eval part for a discussion on this special case.)
If the test fails the form reappears. Note that the e-mail input filed is cleared by adding mailval='' to <mail-form>.
Finally, if all tests pass, we display a nice welcome message and add a button that will take the user back to the start form again.
This section has taught you how to combine <if> and <define> to dynamically show contents of a web page.
The <define> tag is used for creating your own macros such as tags, containers or If-callers. The code
will create the macro 'js' that can be used as an alias for the <if> tag inside the container. You simply use it like this, <if js='js'></if>.
More details about <if> and <define> is found in the Web Site Creator Manual or by adding <help for='if' /> and/or <help for='define' /> in a web page.
The next section, Browser independency with <if supports> will teach how to use the <if supports> plugin to create dynamic pages based on what techniques the client browser supports.