Classic method of annotating

This documentation is for an older version of ZK. For the latest one, please click here.

The Classic Way to annotate the Component Declarations

The annotation appears before the declaration of the element that you want to annotate:

<window xmlns:a="[http://www.zkoss.org/2005/zk/annotation http://www.zkoss.org/2005/zk/annotation]">
    <vbox>
        <a:author name="John Magic" date="3/17/2006"/>
        <listbox>
        </listbox>
    </vbox>
</window>

The annotation is an element in the http://www.zkoss.org/2005/zk/annotation namespace. The element name and attributes can be anything depending on the tool you use. You can annotate the same component declaration with several annotations:

<a:author name="John Magic"/>
<a:editor name="Mary White" date="4/11/2006"/>
<listbox/>

where author and editor are the annotation names, while name and date are the attribute names. In other words, an annotation consists of a name and a map of attributes.

If the annotations annotating a declaration have the same name, they are merged as a single annotation. For example,

<a:define var1="auto"/>
<a:define var2="123"/>
<listbox/>

is equivalent to

<a:define var1="auto" var2="123"/>
<listbox/>

Note: Annotations don't support EL expressions.

The Classic Way to Annotate the Property Declarations

To annotation a property declaration, you can put the annotation in front of the declaration of a property as shown below.

<listitem a:bind="datasource='author',name='name'" value="${author.name}"/>

Alternatively, you can use the attribute element and annotate the declaration of a property similar to the component declaration. In other words, the above annotation is equivalent to the following:

<listitem>
    <a:bind datasource="author" name="name"/>
    <attribute name="value">${author.name}</attribute>
</listitem>

Note: if the attribute name of a annotation is omitted, the name is assumed to be value. For example,

<listitem a:bind="value='selected'" value=""/>

is equivalent to

<listitem a:bind="selected" value=""/>