Templates: Part I

Templates are used to specify the presentational layout of controls. A template can contain static text, components, or controls that contribute to the ultimate presentation of the associated control. By default, an instance of TTemplateControl or its subclass may automatically load and instantiate a template from a file whose name is the same as the control class name. For page templates, the file name suffix must be .page; for other regular template controls, the suffix is .tpl.

The template format is like HTML, with a few PRADO-specifc tags, including component tags, template control tags, comment tags, dynamic content tags, and dynamic property tags.

Component Tags

A component tag specifies a component as part of the body content of the template control. If the component is a control, it usually will become a child or grand child of the template control, and its rendering result will be inserted at the place where it is appearing in the template.

The format of a component tag is as follows,

<com:ComponentType PropertyName="PropertyValue" ... EventName="EventHandler" ...>
body content
</com:ComponentType>
ComponentType can be either the class name or the dotted type name (e.g. System.Web.UI.TControl) of the component. PropertyName and EventName are both case-insensitive. PropertyName can be a property or subproperty name (e.g. Font.Name). Note, PropertyValue will be HTML-decoded when assigned to the corresponding property. Content enclosed between the opening and closing component tag are normally treated the body of the component.

It is required that component tags nest properly with each other and an opening component tag be paired with a closing tag, similar to that in XML.

The following template shows a component tag specifying the Text property and OnClick event of a button control,

<com:TButton Text="Register" OnClick="registerUser" />
Note, property names and event names are all case-insensitive, while component type names are case-sensitive. Event names always begin with On.

Also note, initial values for properties whose name ends with Template are specially processed. In particular, the initial values are parsed as TTemplate objects. The ItemTemplate property of the TRepeater control is such an example.

To facilitate initializing properties with big trunk of data, the following property initialization tag is introduced. It is equivalent to ...PropertyName="PropertyValue"... in every aspect. Property initialization tags must be directly enclosed between the corresponding opening and closing component tag.

<prop:PropertyName>
PropertyValue
</prop:PropertyName>

Since version 3.1.0, the property initialization tag can also be used to initialize a set of subproperties who share the same parent property. For example, the following is equivalent to HeaderStyle.BackColor="black" and HeaderStyle.ForeColor="red".

<prop:HeaderStyle BackColor="black" ForeColor="red" />

Component IDs

When specified in templates, component ID property has special meaning in addition to its normal property definition. A component tag specified with an ID value in template will register the corresponding component to the template owner control. The component can thus be directly accessed from the template control with its ID value. For example, in Home page's template, the following component tag

<com:TTextBox ID="TextBox" Text="First Name" />
makes it possible to get the textbox object in code using $page->TextBox.

Template Control Tags

A template control tag is used to configure the initial property values of the control owning the template. Its format is as follows,
<%@ PropertyName="PropertyValue" ... %>
Like in component tags, PropertyName is case-insensitive and can be a property or subproperty name.

Initial values specified via the template control tag are assigned to the corresponding properties when the template control is being constructed. Therefore, you may override these property values in a later stage, such as the Init stage of the control.

Template control tag is optional in a template. Each template can contain at most one template control tag. You can place the template control tag anywhere in the template. It is recommended that you place it at the beginning of the template for better visibility.

Comment Tags

Comment tags are used to put in a template developer comments that will not display to end-users. Contents enclosed within a comment tag will be treated as raw text strings and PRADO will not attempt to parse them. Comment tags cannot be used within property values. The format of comment tags is as follows,

<!---
Comments INVISIBLE to end-users
--->
Note: The new comment tag <!--- ... ---> has been introduced since PRADO version 3.1. Previously, it was <!-- ... --!> which was deprecated because some editors have problems in syntax-highlighting such tags.

Include Tags

Since version 3.0.5, PRADO starts to support external template inclusion. This is accomplished via include tags, where external template files are specified in namespace format and their file name must be terminated as .tpl.

<%include path.to.templateFile %>

External templates will be inserted at the places where the include tags occur in the base template.

Note, nested template inclusion is not supported, i.e., you cannot have include tags in an external template.