...
These examples assume that there are two zones, "userInput" and "helpPanel", somewhere in the rendered page, waiting to receive the updated content.
Zone Component Id vs. Zone Element Id
Like all Tapestry components, Zones have a component id, specified using the t:id
attribute. If you do not assign a component id, a unique id is assigned by Tapestry.
However, to coordinate things on the client side, it is necessary for components that wish to update the zone know the client-side element id. This is specified with the id
parameter of the Zone component. If the id
parameter is not bound, then a unique value (for the current page and render) is generated by Tapestry and this value is difficult to predict. The actual value will be available as the clientId
property of the Zone component itself.
Remember that the component id (t:id
) is used to inject the Zone component into the containing page or component. The
client-side id (id
) is used ... on the client side to orchestrate requests and updates. You will often seen the following construct:
Code Block | ||||
---|---|---|---|---|
| ||||
<t:zone t:id="myZone" id="myzone"> ... </t:zone>
<t:actionlink t:id="update" zone="myzone">update</t:actionlink>
|
Since | ||
---|---|---|
| ||
If the Form or Link is enclosed by the Zone itself, then the |
An Update div within a Zone div
...
Code Block | ||||
---|---|---|---|---|
| ||||
Tapestry.ElementEffect.myeffectname = function(element){ YourJavascriptCodeGoesHere; }; |
Zone Component Id vs. Zone Element Id
Like all Tapestry components, Zones have a component id, specified using the t:id
attribute. If you do not assign a component id, a unique id is assigned by Tapestry.
However, to coordinate things on the client side, it is necessary for components that wish to update the zone know the client-side element id. This is specified with the id
parameter of the Zone component. If the id
parameter is not bound, then a unique value (for the current page and render) is generated by Tapestry and this value is difficult to predict. The actual value will be available as the clientId
property of the Zone component itself.
Remember that the component id (t:id
) is used to inject the Zone component into the containing page or component. The
client-side id (id
) is used ... on the client side to orchestrate requests and updates. You will often seen the following construct:
Code Block | xml | xml |
---|---|---|
<t:zone t:id="myZone" id="myzone"> ... </t:zone>
<t:actionlink t:id="update" zone="myzone">update</t:actionlink>
| ||
Since | ||
| ||
If the Form or Link is enclosed by the Zone itself, then the zone parameter may be set to the special value ^ . The carat is evaluated, on the client side, by searching up form the form or link element for the first enclosing element with the t-zone CSS class. In this way, the client-side coordination can occur without having to know what the specific client-side id of the Zone is. Because of this, in many cases, it is no longer necessary to specify the Zone's id parameter. |
Zone Limitations
Unlike many other situations, Tapestry relies on you to specify useful and unique ids to Zone components, then reference those ids inside EventLink (or ActionLink, or Form) components. Using Zone components inside any kind of loop may cause additional problems, as Tapestry will uniqueify the client id you specify (appending an index number).
...