xhtml theme

The xhtml theme is the default theme in WebWork. It provides all the basics that the simple theme provides, plus these additional features:

• Standard two-column table layout for the HTML Tags (form, textfield, select, etc)
• Labels for each of the HTML Tags on the left hand side (or top, depending on the labelposition attribute)
• Validation error reporting
• Pure JavaScript Client Side Validation using 100% JavaScript on the browser

The xhtml theme uses the wrapping technique mentioned in Extending Themes. As such, it is important to understand how the HTML tags are wrapped by a standard header and footer. For example, take a look at the textfield template, text.ftl:

As you can see, the controlheader.ftl and controlfooter.ftl templates are wrapped around the simple template. In case you are wondering, the reason the controlheader.ftl is refered using ${parameters.theme} is to assist with code re-use for the ajax theme. For now, assume that the xhtml theme is used there as well.

Now let's look at the controlheader.ftl contents:

And the controlfooter.ftl contents:

While most of the templates in this theme are self explanatory, there are some templates that should be called out and explained in detail:

• xhtml head template
• xhtml form template