Chapter 4. Templates

Table of Contents

1. The block tag
2. The value tag
3. Overriding the default value
4. The include tag

We've learned a bit about templates in the previous chapter, but since they are a big part of any web application, we'll dig a bit deeper into them now. Let's revisit the guess template from the game:

Example 4.1. guess.html

<html>
  <head><title>Perform a guess</title></head>
  <body>
    <p>Guess a number from 0 to 100</p>
    <!--V 'warning'--><!--/V-->
    <!--B 'invalid'-->
    <p><font color="#990000">The guess is invalid.</font></p>
    <!--/B-->
    <p><i><!--V 'indication'--><!--/V--></i></p>
    <!--B 'lower'-->The answer is lower.<!--/B-->
    <!--B 'higher'-->The answer is higher.<!--/B-->
    <form action="[!V 'SUBMISSION:FORM:performGuess'/]" method="post">
      <!--V 'SUBMISSION:PARAMS:performGuess'/-->
      <input type="text" name="guess" 
             value="[!V 'PARAM:guess'][!/V]" /><br />
      <input type="submit" value="Guess" /><br />
    </form>
    <script language="javascript">document.forms[0].guess.focus();</script>
  </body>
</html>

In Example 4.1, “guess.html” there are two different template tags, the V and B tags. These were briefly explained in Section 4, “Templates” and were described as a value tag and a block tag.