Author: buildbot
Date: Sat Mar 18 15:20:07 2017
New Revision: 1008583
Log:
Production update by buildbot for tapestry
Modified:
websites/production/tapestry/content/ajax-and-zones.html
websites/production/tapestry/content/cache/main.pageCache
Modified: websites/production/tapestry/content/ajax-and-zones.html
==============================================================================
--- websites/production/tapestry/content/ajax-and-zones.html (original)
+++ websites/production/tapestry/content/ajax-and-zones.html Sat Mar 18
15:20:07 2017
@@ -174,35 +174,31 @@
</div>
-<p>Ajax support is included in many <a
href="component-reference.html">built-in components</a> and <a
href="component-mixins.html">component mixins</a> via
the <code>async</code> parameter (in Tapestry 5.4+) and
the <code>zone</code> parameter (for earlier versions).</p><div
class="code panel pdl" style="border-width: 1px;"><div class="codeHeader
panelHeader pdl" style="border-bottom-width: 1px;"><b>Page or component
template (partial)</b></div><div class="codeContent panelContent pdl">
+<p>Ajax support is included in many <a
href="component-reference.html">built-in components</a> and <a
href="component-mixins.html">component mixins</a> via
the <code>async</code> parameter (in Tapestry 5.4+) and
the <code>zone</code> parameter (for earlier versions). Here we use an
EventLink component to trigger an Ajax update of another area of the
page:</p><div class="code panel pdl" style="border-width: 1px;"><div
class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Page or
component template (partial)</b></div><div class="codeContent panelContent pdl">
<pre class="brush: xml; gutter: false; theme: Default"
style="font-size:12px;"><t:eventlink event="updateTime"
async="true">update</t:eventlink>
...
<t:zone t:id="timeArea" id="timeArea">
The current time is ${currentTime}
</t:zone>
</pre>
-</div></div><div class="code panel pdl" style="border-width: 1px;"><div
class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Page or
component class (partial)</b></div><div class="codeContent panelContent pdl">
+</div></div><p>The corresponding Java code looks like this:</p><div
class="code panel pdl" style="border-width: 1px;"><div class="codeHeader
panelHeader pdl" style="border-bottom-width: 1px;"><b>Page or component class
(partial)</b></div><div class="codeContent panelContent pdl">
<pre class="brush: java; gutter: false; theme: Default"
style="font-size:12px;">@Inject
private AjaxResponseRenderer ajaxResponseRenderer;
@InjectComponent
private Zone timeArea;
-...
+
+@Property
+private Date currentTime;
+ ...
void onUpdateTime()
{
- ajaxResponseRenderer.addRender(timeArea);
-}
-</pre>
-</div></div><h2 id="AjaxandZones-Zones">Zones</h2><p>Zones are Tapestry's
approach to performing partial page updates. A <a class="external-link"
href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Zone.html";>Zone
component</a> renders as an HTML element, typically a <div>.</p><p>A
zone is recognizable in the DOM because it will have the
attribute <code>data-container-type=zone</code>. The client-side support
for Zones is keyed off of this attribute and value.</p><p><span
style="line-height: 1.4285715;">A Zone can be updated via an EventLink,
ActionLink or Select component, or by a Form. All of these components support a
zone parameter, which provides the id of the Zone's <div>. Clicking such
a link will invoke an event handler method on the server as normal ... except
that the return value of the event handler method is used to send a </span><em
style="line-height: 1.4285715;">partial page response</em><span
style="line-height:
1.4285715;"> to the client, and the content of that response is used to
update the Zone's <div> in place.</span></p><div class="code panel pdl"
style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<pre class="brush: xml; gutter: false; theme: Default"
style="font-size:12px;"><t:actionlink t:id="someLink"
zone="myzone">update</t:actionlink>
-...
-<t:zone t:id="myZone" id="myzone">
- The current time is ${currentTime}
-</t:zone>
-</pre>
-</div></div><h3 id="AjaxandZones-EventHandlerReturnTypes">Event Handler Return
Types</h3><p></p><div class="navmenu" style="float:right; background:#eee;
margin:3px; padding:0 1em">
+ currentTime = new Date();
+  ajaxResponseRenderer.addRender(timeArea);
+} </pre>
+</div></div><p>That <code>onUpdateTime</code> method is just an ordinary
Tapestry event handler, except that it uses an injected
<code>AjaxResponseRenderer</code> to tell Tapestry what zone to update when the
link is clicked.</p><h2 id="AjaxandZones-Zones">Zones</h2><p>Zones are
Tapestry's approach to performing partial page updates. A <a
class="external-link"
href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Zone.html";>Zone
component</a> renders as an HTML element, typically a <div>, and serves
as a marker for where dynamically-updated content should be replaced. Starting
in Tapestry 5.4 you can use any HTML element in your template as that marker,
using the two-argument version of the addRender method.</p><p>A zone is
recognizable in the DOM because it will have the
attribute <code>data-container-type=zone</code>. The client-side support
for Zones is keyed off of this attribute and value.</p><p><span
style="line-height: 1.4285715;
">A Zone can be updated via an EventLink, ActionLink or Select component, or
by a Form. All of these components support the <code>async</code> and/or
<code>zone</code> parameters. Clicking such a link will invoke an event handler
method on the server as normal ... except that a </span><em style="line-height:
1.4285715;">partial page response</em><span style="line-height: 1.4285715;"> is
sent to the client, and the content of that response is used to update the
Zone's <div> in place.</span></p><h3
id="AjaxandZones-EventHandlerReturnTypes">Event Handler Return
Types</h3><p></p><div class="navmenu" style="float:right; background:#eee;
margin:3px; padding:0 1em">
<p> <strong>JumpStart Demo:</strong><br clear="none">
- <a class="external-link"
href="http://jumpstart.doublenegative.com.au/jumpstart/examples/ajax/actionlink";
rel="nofollow">AJAX ActionLink</a></p></div>In a traditional request, the
return value of an event handler method is used to determine which page will
render a <em>complete</em> response, and a <em>redirect</em> is sent to the
client to render the new page (as a new request).<p>In contrast, with a Zone
update, the return value is used to render a <em>partial response</em> within
the <em>same request</em>.</p><p>This return value is often just the zone's own
body (as below), but it can also be an injected component or block. The value
will be rendered, and that markup will be used on the client side to update the
Zone's <div>.</p><div class="code panel pdl" style="border-width:
1px;"><div class="codeContent panelContent pdl">
+ <a class="external-link"
href="http://jumpstart.doublenegative.com.au/jumpstart/examples/ajax/actionlink";
rel="nofollow">AJAX ActionLink</a></p></div>In a traditional request, the
return value of an event handler method may used to determine which page will
render a <em>complete</em> response, and a <em>redirect</em> may sent to the
client to render the new page (as a new request).<p>In contrast, with a Zone
update, the return value may used to render a <em>partial response</em> within
the <em>same request</em>.</p><div class="confluence-information-macro
confluence-information-macro-note"><span class="aui-icon aui-icon-small
aui-iconfont-warning confluence-information-macro-icon"></span><div
class="confluence-information-macro-body"><p>Starting in Tapestry 5.3, Ajax
event handlers typically have a void return type and use AjaxResponseRenderer
to indicate which zone to update. The AjaxResponseRender approach means that
the <code>zone</code> parameter's value (oridinarily i
ndicating which zone to update) is no longer needed. Tapestry 5.4 introduced
the <code>async="true"</code> parameter to avoid having to redundantly
indicate which zone to update.</p></div></div><p> </p><p>This return value
is often just the zone's own body (as below), but it can also be an injected
component or block. The value will be rendered, and that markup will be used on
the client side to update the Zone's <div>.</p><div class="code panel
pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
<pre class="brush: java; gutter: false; theme: Default"
style="font-size:12px;">@Inject
private Request request;
Modified: websites/production/tapestry/content/cache/main.pageCache
==============================================================================
Binary files - no diff available.
