tapestry-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Bob Harner (Confluence)" <conflue...@apache.org>
Subject [CONF] Apache Tapestry > Ajax and Zones
Date Sat, 18 Jan 2014 17:47:00 GMT
<html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <base href="https://cwiki.apache.org/confluence" />
        <style type="text/css">
    body, #email-content, #email-content-inner { font-family: Arial,FreeSans,Helvetica,sans-serif; }
    body, p, blockquote, pre, code, td, th, li, dt, dd { font-size: 13px; }
    small { font-size: 11px; }

    body { width:100% !important; -webkit-font-smoothing: antialiased; }

    body,
    #email-wrapper { background-color: #f0f0f0; }
    #email-wrapper-inner { padding: 20px; text-align: center; }
    #email-content-inner { background-color: #fff; border: 1px solid #bbb; color: $menuTxtColour; padding:20px; text-align:left; }
    #email-wrapper-inner > table { width: 100%; }
    #email-wrapper-inner.thin > table { margin: 0 auto; width: 50%; }
    #email-footer { padding: 0 16px 32px 16px; margin: 0; }

    .email-indent { margin: 8px 0 16px 0; }
    .email-comment { margin: 0 0 0 56px; }
    .email-comment.removed { background-color: #ffe7e7; border: 1px solid #df9898; padding: 0 8px;}

    #email-title-avatar { text-align: left; vertical-align: top; width: 48px; padding-right: 8px; }
    #email-title-flavor { margin: 0; padding: 0 0 4px 0; }
    #email-title-heading { font-size: 16px; line-height: 20px; min-height: 20px; margin: 0; padding: 0; }
    #email-title .icon { border: 0; padding: 0 5px 0 0; text-align: left; vertical-align: middle; }

    #email-actions { border-top: 1px solid #bbb; color: #505050; margin: 8px 0 0 0; padding: 0; }
    #email-actions td { padding-top: 8px; }
    #email-actions .left { max-width: 45%; text-align: left; }
    #email-actions .right { text-align: right; }
    .email-reply-divider { border-top: 1px solid #bbb; color: #505050; margin: 32px 0 8px 0; padding: 8px 0; }
    .email-section-title { border-bottom: 1px solid #bbb; margin: 8px 0; padding: 8px 0 0 0; }

    .email-metadata { color: #505050; }

    a { color: #326ca6; text-decoration: none; }
    a:hover { color: #336ca6; text-decoration: underline; }
    a:active {color: #326ca6; }

    a.email-footer-link { color: #505050; font-size: 11px; }

    .email-item-list { list-style: none; margin: 4px 0; padding-left: 0; }
    .email-item-list li { list-style: none; margin: 0; padding: 4px 0; }
    .email-list-divider { color: #505050; padding: 0 0.35em; }
    .email-operation-icon { padding-right: 5px; }

    .avatar { -ms-interpolation-mode: bicubic; border-radius: 3px;}
    .avatar-link { margin: 2px; }

    .tableview th { border-bottom: 1px solid #69C; font-weight: bold; text-align: left; }
    .tableview td { border-bottom: 1px solid #bbbbbb; text-align: left; padding: 4px 16px 4px 0; }

    .aui-message {  margin: 1em 0; padding: 8px; }
    .aui-message.info { background-color: #e0f0ff; border: 1px solid #9eb6d4; }
    .aui-message.success { background-color: #ddfade; border: 1px solid #93c49f; }
    .aui-message.error,
    .aui-message.removed { background-color: #ffe7e7; border: 1px solid #df9898; color: #000; }

    .call-to-action-table { margin: 10px 1px 1px 1px;}
    .call-to-cancel-container, .call-to-action-container { padding: 5px 20px; }
    .call-to-cancel-container { border: 1px solid #aaa; background-color: #eee; border-radius: 3px; }
    .call-to-cancel-container a.call-to-cancel-button { background-color: #eee; font-size: 14px; line-height: 1; padding: 0; margin: 0; color: #666; font-family: sans-serif;}
    .call-to-action-container { border: 1px solid #486582;  background-color: #3068A2; border-radius: 3px; padding: 4px 10px; }
    .call-to-action-container a.call-to-action-button { background-color: #3068A2; font-size: 14px; line-height: 1; padding: 0; margin: 0; color: #fff; font-weight: bold; font-family: sans-serif; }

    /** The span around the inline task checkbox image */
    .diff-inline-task-overlay {
        display: inline-block;
        text-align: center;
        height: 1.5em;
        padding: 5px 0px 1px 5px;
        margin-right: 5px;
        /** Unfortunately, the negative margin-left is stripped out in gmail */
        margin-left: -5px;
    }

            @media handheld, only screen and (max-device-width: 480px) {
        div, a, p, td, th, li, dt, dd { -webkit-text-size-adjust: auto; }
        small, small a { -webkit-text-size-adjust: 90%; }

        td[id=email-wrapper-inner] { padding: 2px !important; }
        td[id=email-content-inner] { padding: 8px !important; }
        td[id="email-wrapper-inner"][class="thin"] > table { text-align: left !important; width: 100% !important; }
        td[id=email-footer] { padding: 8px 12px !important; }
        div[class=email-indent] { margin: 8px 0px !important; }
        div[class=email-comment] { margin: 0 !important; }

        p[id=email-title-flavor] a { display: block; } /* puts the username and the action on separate lines */
        p[id=email-permalink] { padding: 4px 0 0 0 !important; }

        table[id=email-actions] td { padding-top: 0 !important; }
        table[id=email-actions] td.right { text-align: right !important; }
        table[id=email-actions] .email-list-item { display: block; margin: 1em 0 !important; word-wrap: normal !important; }
        span[class=email-list-divider] { display: none; }
    }



        </style>
    </head>
    <body style="font-family: Arial, FreeSans, Helvetica, sans-serif; font-size: 13px; width: 100%; -webkit-font-smoothing: antialiased; background-color: #f0f0f0">
        <table id="email-wrapper" width="100%" cellspacing="0" cellpadding="0" border="0" style="background-color: #f0f0f0">
            <tbody>
                <tr valign="middle">
                    <td id="email-wrapper-inner" style="font-size: 13px; padding: 20px; text-align: center">
                        <table id="email-content" cellspacing="0" cellpadding="0" border="0" style="font-family: Arial, FreeSans, Helvetica, sans-serif; width: 100%">
                            <tbody>
                                <tr valign="top">
                                    <td id="email-content-inner" align="left" style="font-family: Arial, FreeSans, Helvetica, sans-serif; font-size: 13px; background-color: #fff; border: 1px solid #bbb; padding: 20px; text-align: left">
                                        <table id="email-title" cellpadding="0" cellspacing="0" border="0" width="100%">
                                            <tbody>
                                                <tr>
                                                    <td id="email-title-avatar" rowspan="2" style="font-size: 13px; text-align: left; vertical-align: top; width: 48px; padding-right: 8px"> <img class="avatar" src="cid:avatar_3e887652b12fb11536f684df760c7805" border="0" height="48" width="48" style="-ms-interpolation-mode: bicubic; border-radius: 3px" /> </td>
                                                    <td valign="top" style="font-size: 13px">
                                                        <div id="email-title-flavor" class="email-metadata" style="margin: 0; padding: 0 0 4px 0; color: #505050">
                                                            <a href="    https://cwiki.apache.org/confluence/display/~bobharner " style="color:#326ca6;text-decoration:none;; color: #326ca6; text-decoration: none">Bob Harner</a> edited the page:
                                                        </div> </td>
                                                </tr>
                                                <tr>
                                                    <td valign="top" style="font-size: 13px"> <h2 id="email-title-heading" style="font-size: 16px; line-height: 20px; min-height: 20px; margin: 0; padding: 0"> <a href="https://cwiki.apache.org/confluence/display/TAPESTRY/Ajax+and+Zones" style="color: #326ca6; text-decoration: none"> <img class="icon" src="cid:page-icon" alt="" style="border: 0; padding: 0 5px 0 0; text-align: left; vertical-align: middle" /> <strong style="font-size:16px;line-height:20px;vertical-align:top;">Ajax and Zones</strong> </a> </h2> </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                        <div class="email-indent" style="margin: 8px 0 16px 0">
                                            <p class="aui-message info" style="font-size: 13px; margin: 1em 0; padding: 8px; background-color: #e0f0ff; border: 1px solid #9eb6d4"> <b>Comment:</b> fixed language param of code macro </p>
                                            <div class="email-diff">
                                                <div id="page-diffs" class="wiki-content">
                                                    <p class="diff-context-placeholder" style="font-size: 13px">...</p>
                                                    <p class="diff-block-context" style="font-size: 13px">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 &lt;div&gt;. 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 <em>partial page response</em> to the client, and the content of that response is used to update the Zone's &lt;div&gt; in place.</p>
                                                    <table class="diff-macro diff-block-target" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-0" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">xml</td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">
<span class="diff-html-removed" id="removed-diff-0" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;">
</span>&lt;t:actionlink t:id=&quot;someLink&quot; zone=&quot;myzone&quot;&gt;update&lt;/t:actionlink&gt;
...
&lt;t:zone t:id=&quot;myZone&quot; id=&quot;myzone&quot;&gt;
    The current time is ${currentTime}
&lt;/t:zone&gt;
</pre> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <p class="diff-context-placeholder" style="font-size: 13px">...</p>
                                                    <p class="diff-block-context" style="font-size: 13px">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 &lt;div&gt;.</p>
                                                    <table class="diff-macro diff-block-target" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-1" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">java</td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">
<span class="diff-html-removed" id="removed-diff-1" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;">
</span>@Inject
private Request request;

@InjectComponent
private Zone myZone;
...
Object onClickFromSomeLink()
{
   return myZone.getBody(); // AJAX request, return zone's own body
}
</pre> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <p class="diff-context-placeholder" style="font-size: 13px">...</p>
                                                    <p class="diff-block-context" style="font-size: 13px">To support graceful degradation, you should detect that case in your event handler method and return a traditional response: a page, page name or page class. This is accomplished by injecting the <a href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/services/Request.html" class="external-link" rel="nofollow" style="color: #326ca6; text-decoration: none">Request</a> object, and invoking the isXHR() method. This value will be true for Ajax requests, and false for traditional request.</p>
                                                    <table class="diff-macro diff-block-target" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-2" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">java</td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">
<span class="diff-html-removed" id="removed-diff-2" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;">
</span>@Inject
private Request request;

@InjectComponent
private Zone myZone;
...
Object onClickFromSomeLink()
{
    // return either the zone body (ajax) or whole page (non-ajax)
    return request.isXHR() ? myZone.getBody() : null;
}
</pre> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <p class="diff-context-placeholder" style="font-size: 13px">...</p>
                                                    <p class="diff-block-context" style="font-size: 13px">The renderer for each zone can be the zone itself, a block, a component, a <a href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/Renderable.html" class="external-link" rel="nofollow" style="color: #326ca6; text-decoration: none">Renderable</a> or a <a href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/runtime/RenderCommand.html" class="external-link" rel="nofollow" style="color: #326ca6; text-decoration: none">RenderCommand</a> ... or an object, such as String, that can be coerced to either of these.</p>
                                                    <table class="diff-macro diff-block-target" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/images/icons/macrobrowser/dropdown/section.png" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Section</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px">
                                                                    <table class="diff-macro" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                                        <thead>
                                                                            <tr>
                                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/images/icons/macrobrowser/dropdown/column.png" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Column</th>
                                                                            </tr>
                                                                        </thead>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <span class="diff-html-removed" id="removed-diff-4" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;"> </span>
                                                                                    <table class="diff-macro" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                                                        <thead>
                                                                                            <tr>
                                                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                                                            </tr>
                                                                                        </thead>
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                                                    <table>
                                                                                                        <tbody>
                                                                                                            <tr>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-removed" id="removed-diff-3" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;">java</span></td>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">title</td>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">For Tapestry 5.3 and later</td>
                                                                                                            </tr>
                                                                                                        </tbody>
                                                                                                    </table> </td>
                                                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                                                    <table>
                                                                                                        <tbody>
                                                                                                            <tr>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-3" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" style="font-size: 100%; background-color: #ddfade;">java</span></td>
                                                                                                            </tr>
                                                                                                        </tbody>
                                                                                                    </table> </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">@InjectComponent
private Zone userInput;

@InjectComponent
private Zone helpPanel;

@Inject
private AjaxResponseRenderer ajaxResponseRenderer;

void onActionFromRegister()
{
    ajaxResponseRenderer.addRender(&quot;userInput&quot;,
        userInput).addRender(&quot;helpPanel&quot;, helpPanel);
}
</pre> </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                    </table> </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                    <table class="diff-macro" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                                        <thead>
                                                                            <tr>
                                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/images/icons/macrobrowser/dropdown/column.png" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Column</th>
                                                                            </tr>
                                                                        </thead>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <span class="diff-html-removed" id="removed-diff-6" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;"> </span>
                                                                                    <table class="diff-macro" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                                                        <thead>
                                                                                            <tr>
                                                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                                                            </tr>
                                                                                        </thead>
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                                                    <table>
                                                                                                        <tbody>
                                                                                                            <tr>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-removed" id="removed-diff-5" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;">java</span></td>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">title</td>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">For Tapestry 5.1, 5.2 and 5.3</td>
                                                                                                            </tr>
                                                                                                        </tbody>
                                                                                                    </table> </td>
                                                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                                                    <table>
                                                                                                        <tbody>
                                                                                                            <tr>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-4" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" style="font-size: 100%; background-color: #ddfade;">java</span></td>
                                                                                                            </tr>
                                                                                                        </tbody>
                                                                                                    </table> </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">@Inject
private Form registrationForm;

@Inject Block registrationHelp;

Object onActionFromRegister()
{
    return new MultiZoneUpdate(&quot;userInput&quot;,
        registrationForm).add(&quot;helpPanel&quot;,
        registrationHelp);
}
</pre> </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                    </table> <p style="font-size: 13px">&nbsp; &nbsp; <em>Note that MultiZoneUpdate is deprecated starting with Tapestry 5.3.</em> </p> </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <p class="diff-context-placeholder" style="font-size: 13px">...</p>
                                                    <p class="diff-block-context" style="font-size: 13px">Remember that the component id (<code style="font-size: 13px">t:id</code>) is used to <em>inject</em> the Zone component into the containing page or component. The<br /> client-side id (<code style="font-size: 13px">id</code>) is used ... on the client side to orchestrate requests and updates. You will often seen the following construct:</p>
                                                    <table class="diff-macro diff-block-target diff-block-context" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-5" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">xml</td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">
<span class="diff-html-removed" id="removed-diff-7" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;">
</span>&lt;t:zone t:id=&quot;myZone&quot; id=&quot;myzone&quot;&gt; ... &lt;/t:zone&gt;

&lt;t:actionlink t:id=&quot;update&quot; zone=&quot;myzone&quot;&gt;update&lt;/t:actionlink&gt;
</pre> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <table class="diff-macro diff-block-target" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px">since</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">since</td>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">5.2</td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">
<span class="diff-html-removed" id="removed-diff-8" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;">
</span>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.
</pre> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <p class="diff-context-placeholder" style="font-size: 13px">...</p>
                                                    <p class="diff-block-context" style="font-size: 13px">To have Tapestry update a zone without the usual yellow highlight effect, just specify &quot;show&quot; for the update parameter:</p>
                                                    <table class="diff-macro diff-block-target" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-6" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" style="font-size: 100%; background-color: #ddfade;">xml</span></td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">&lt;t:zone t:id=&quot;myZone&quot; t:update=&quot;show&quot;&gt;</pre> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <p class="diff-block-context" style="font-size: 13px">You may also define and use your own JavaScript effect function (with lower-case names), like this:</p>
                                                    <span class="diff-html-removed" id="removed-diff-10" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;"> </span>
                                                    <table class="diff-macro diff-block-target" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px"> <span class="diff-html-removed" id="removed-diff-9" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;">JavaScript</span>
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-7" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-8" style="font-size: 100%; background-color: #ddfade;">js</span></td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">Tapestry.ElementEffect.myeffectname = function(element){ YourJavascriptCodeGoesHere; };
</pre> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <p class="diff-context-placeholder" style="font-size: 13px">...</p>
                                                    <p class="diff-block-context" style="font-size: 13px">Autocomplete can be added to an existing text field:</p>
                                                    <table class="diff-macro diff-block-target" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-9" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">java</td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">
<span class="diff-html-removed" id="removed-diff-11" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;"> </span>&lt;t:textfield t:id=&quot;accountName&quot; t:mixins=&quot;autocomplete&quot; size=&quot;100&quot;/&gt;
</pre> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <p class="diff-context-placeholder" style="font-size: 13px">...</p>
                                                    <p class="diff-block-context" style="font-size: 13px">You must write an event handler to provide these completions. The name of the event is &quot;providecompletions&quot;. The context is the partial input value, and the return value will be converted into the selections for the user.</p>
                                                    <p class="diff-block-context" style="font-size: 13px">For example:</p>
                                                    <table class="diff-macro diff-block-target" style="background-color: #f0f0f0;border: 1px solid #dddddd;margin: 10px 1px;padding: 0 2px 2px;width: 100%;">
                                                        <thead>
                                                            <tr>
                                                                <th class="diff-macro-title" style="background-color: transparent; text-align: left; font-weight: normal;padding: 5px;; font-size: 13px"><span class="icon macro-placeholder-icon" style="background-color: ;line-height: 20px;"><img src="https://cwiki.apache.org/confluence/s/en_GB-1988229788/4109/76e0dbb30bc8580e459c201f3535d84f9283a9ac.1/_/plugins/servlet/confluence/placeholder/macro-icon?name=code" style="padding-right: 5px; vertical-align: text-bottom;" /> </span>Code Block</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-properties" style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;padding: 0; border: 1px solid #dddddd;; font-size: 13px">
                                                                    <table>
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px"><span class="diff-html-added" id="added-diff-10" style="font-size: 100%; background-color: #ddfade;">language</span></td>
                                                                                <td style="background-color: #fafafa; padding: 0 0 0 5px; font-size: 12px; text-align: left;; font-size: 13px">java</td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table> </td>
                                                            </tr>
                                                        </tbody>
                                                        <tbody>
                                                            <tr>
                                                                <td class="diff-macro-body" style="background-color: #fff;border: 1px solid #dddddd;padding: 10px;; font-size: 13px"> <pre style="font-size: 13px">
<span class="diff-html-removed" id="removed-diff-12" style="font-size: 100%; background-color: #ffe7e7; text-decoration: line-through;"> </span>List&lt;String&gt; onProvideCompletionsFromAccountName(String partial)
  {
    List&lt;Account&gt; matches = accountDAO.findByPartialAccountName(partial);

    List&lt;String&gt; result = new ArrayList&lt;String&gt;();

    for (Account a : matches)
    {
      result.add(a.getName());
    }

    return result;
  }
</pre> </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <p class="diff-context-placeholder" style="font-size: 13px">...</p>
                                                </div>
                                            </div>
                                        </div>
                                        <table id="email-actions" class="email-metadata" cellspacing="0" cellpadding="0" border="0" width="100%" style="border-top: 1px solid #bbb; color: #505050; margin: 8px 0 0 0; padding: 0; color: #505050">
                                            <tbody>
                                                <tr>
                                                    <td class="left" valign="top" style="font-size: 13px; padding-top: 8px; max-width: 45%; text-align: left"> <span class="email-list-item"><a href="https://cwiki.apache.org/confluence/display/TAPESTRY/Ajax+and+Zones" style="color: #326ca6; text-decoration: none">View Online</a> </span> <span class="email-list-divider" style="color: #505050; padding: 0 0.350em">&middot;</span> <span class="email-list-item"><a href="https://cwiki.apache.org/confluence/plugins/likes/like.action?contentId=25202583" style="color: #326ca6; text-decoration: none">Like</a> </span> <span class="email-list-divider" style="color: #505050; padding: 0 0.350em">&middot;</span> <span class="email-list-item"><a href="https://cwiki.apache.org/confluence/pages/diffpagesbyversion.action?pageId=25202583&amp;revisedVersion=22&amp;originalVersion=21" style="color: #326ca6; text-decoration: none">View Changes</a> </span> </td>
                                                    <td class="right" width="50%" valign="top" style="font-size: 13px; padding-top: 8px; text-align: right"> <span class="email-list-item"><a href="https://cwiki.apache.org/confluence/users/removespacenotification.action?spaceKey=TAPESTRY" style="color: #326ca6; text-decoration: none">Stop watching space</a> </span> <span class="email-list-divider" style="color: #505050; padding: 0 0.350em">&middot;</span> <span class="email-list-item"><a href="https://cwiki.apache.org/confluence/users/editmyemailsettings.action" style="color: #326ca6; text-decoration: none">Manage Notifications</a> </span> </td>
                                                </tr>
                                            </tbody>
                                        </table> </td>
                                </tr>
                            </tbody>
                        </table> </td>
                </tr>
                <tr>
                    <td id="email-footer" align="center" style="font-size: 13px; padding: 0 16px 32px 16px; margin: 0"> <small style="font-size: 11px"> This message was sent by <a class="email-footer-link" style="color:#505050;font-size:11px;text-decoration:none;; color: #326ca6; text-decoration: none; color: #505050; font-size: 11px" href="http://www.atlassian.com/software/confluence">Atlassian Confluence</a> 5.0.3, <a class="email-footer-link" style="color:#505050;font-size:11px;text-decoration:none;; color: #326ca6; text-decoration: none; color: #505050; font-size: 11px" href="http://www.atlassian.com/software/confluence/overview/team-collaboration-software?utm_source=email-footer">Team Collaboration Software</a> </small> </td>
                </tr>
            </tbody>
        </table>
    </body>
</html>
Mime
View raw message