Modified: websites/production/tapestry/content/component-classes.html ============================================================================== --- websites/production/tapestry/content/component-classes.html (original) +++ websites/production/tapestry/content/component-classes.html Thu Oct 27 17:20:26 2016 @@ -45,18 +45,13 @@ <div class="wrapper bs"> - <div id="navigation"><div class="nav"> -<ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul> -</div></div> + <div id="navigation"><div class="nav"><ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul></div></div> <div id="top"> - <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span> -<form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> - <input type="text" name="q"> - <input type="submit" value="Search"> -</form> - -</div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Classes</h1></div></div> + <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span><form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> + <input type="text" name="q"> + <input type="submit" value="Search"> +</form></div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Classes</h1></div></div> <div class="clearer"></div> </div> @@ -68,73 +63,43 @@ </div> <div id="content"> - <div id="ConfluenceContent"><p>A <strong>component class</strong> is the class associated with a page, component or mixin in your Tapestry web application. Classes for pages, components and mixins are all created in an identical way. They are pure POJOs (Plain Old Java Objects), typically with annotations and conventionally named methods. They are not <em>abstract</em>, nor do they need to extend base classes or implement interfaces.</p><div class="aui-label" style="float:right" title="Related Articles"> - - - - - - - - -<h3>Related Articles</h3> - -<ul class="content-by-label"><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-reference.html">Component Reference</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-libraries.html">Component Libraries</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="page-and-component-classes-faq.html">Page And Component Classes FAQ</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-templates.html">Component Templates</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-cheat-sheet.html">Component Cheat Sheet</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-parameters.html">Component Parameters</a> - - - </div> - </li></ul> -</div><p>In most cases, each component class will have a corresponding <a href="component-templates.html">component template</a>. However, it is also possible for a component class to emit all of its markup itself, without using a template.</p><p><em>For Tapestry 4 Users: Component classes in Tapestry 5 are much easier than in Tapestry 4. There are no base classes to extend from, the classes are concrete (not abstract), and there's no XML file. There is still a bit of configuration in the form of Java annotations, but those now go directly onto fields of your class, rather than on abstract getters and setters.</em></p><h2 id="ComponentClasses-CreatingaTrivialComponent">Creating a Trivial Component</h2><p>Creating a page or component in Tapestry 5 is a breeze. There are only a few constraints:</p><ul><li>There must be a public Java class.</li><li>The class must be in the correct package (see below).</li><li>The class must have a public, no-arguments constructor. (The default one pro vided by the compiler is fine.)</li></ul><p>Here's a minimal component that outputs a fixed message, using a <a href="component-templates.html">template</a> with a matching file name:</p><div class="sectionColumnWrapper"><div class="sectionMacro"><div class="sectionMacroRow"><div class="columnMacro"><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>HelloWorld.java</b></div><div class="codeContent panelContent pdl"> + <div id="ConfluenceContent"><p>A <strong>component class</strong> is the class associated with a page, component or mixin in your Tapestry web application. Classes for pages, components and mixins are all created in an identical way. They are pure POJOs (Plain Old Java Objects), typically with annotations and conventionally named methods. They are not <em>abstract</em>, nor do they need to extend base classes or implement interfaces.</p><div class="aui-label" style="float:right" title="Related Articles"><h3>Related Articles</h3><ul class="content-by-label"><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-reference.html">Component Reference</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-libraries.html">Component Libraries</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="page-and-component-classes-faq.html">Page And Component Classes FAQ</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-templates.html">Component Templates</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-cheat-sheet.html">Component Cheat Sheet</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-parameters.html">Component Parameters</a> + </div> </li></ul></div><p>In most cases, each component class will have a corresponding <a href="component-templates.html">component template</a>. However, it is also possible for a component class to emit all of its markup itself, without using a template.</p><p><em>For Tapestry 4 Users: Component classes in Tapestry 5 are much easier than in Tapestry 4. There are no base classes to extend from, the classes are concrete (not abstract), and there's no XML file. There is still a bit of configuration in the form of Java annotations, but those now go directly onto fields of your class, rather than on abstract getters and setters.</em></p><h2 id="ComponentClasses-CreatingaTrivialComponent">Creating a Trivial Component</h2><p>Creating a page or component in Tapestry 5 is a breeze. There are only a few constraints:</p><ul><li>There must be a public Java class.</li><li>The class must be in the correct package (see below).</li><li>The class must have a public, no-arguments constructor. ( The default one provided by the compiler is fine.)</li></ul><p>Here's a minimal component that outputs a fixed message, using a <a href="component-templates.html">template</a> with a matching file name:</p><div class="sectionColumnWrapper"><div class="sectionMacro"><div class="sectionMacroRow"><div class="columnMacro"><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>HelloWorld.java</b></div><div class="codeContent panelContent pdl"> <pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">package org.example.myapp.components; public class HelloWorld { @@ -164,9 +129,7 @@ public class HelloWorld <div class="confluence-information-macro confluence-information-macro-warning"><p class="title">Deprecated since 5.2</p><span class="aui-icon aui-icon-small aui-iconfont-error confluence-information-macro-icon"></span><div class="confluence-information-macro-body"> </div></div> -<div style="border-right: 20px solid #ffcccc;border-left: 20px solid #ffcccc;"> -<p>For Tapestry 5.1 and earlier, in the rare event that you have a variable that can keep its value between requests and you would like to defeat that reset logic, then you can add a @<a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/Retain.html";>Retain</a> annotation to the field. You should take care that no client-specific data is stored into such a field, since on a later request the same page <em>instance</em> may be used for a different user. Likewise, on a later request for the <em>same</em> client, a <em>different</em> page instance may be used.</p> -</div><p>Use <a href="persistent-page-data.html">persistent fields</a> to hold client-specific information from one request to the next.</p><p>Further, final fields are (in fact) final, and will not be reset between requests.</p><h2 id="ComponentClasses-Constructors">Constructors</h2><p>Tapestry will instantiate your class using the default, no arguments constructor. Other constructors will be ignored.</p><h2 id="ComponentClasses-Injection">Injection</h2><p>Main Article: <a href="injection.html">Injection</a></p><p>Injection of dependencies occurs at the field level, via additional annotations. At runtime, fields that contain injections become read-only.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl"> +<div style="border-right: 20px solid #ffcccc;border-left: 20px solid #ffcccc;"><p>For Tapestry 5.1 and earlier, in the rare event that you have a variable that can keep its value between requests and you would like to defeat that reset logic, then you can add a @<a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/Retain.html";>Retain</a> annotation to the field. You should take care that no client-specific data is stored into such a field, since on a later request the same page <em>instance</em> may be used for a different user. Likewise, on a later request for the <em>same</em> client, a <em>different</em> page instance may be used.</p></div><p>Use <a href="persistent-page-data.html">persistent fields</a> to hold client-specific information from one request to the next.</p><p>Further, final fields are (in fact) final, and will not be reset between requests.</p><h2 id="ComponentClasses-Constructors">Constructors</h2><p>Tapestry will instantiate your class using the default, no arguments constructor. Other constructors will be ignored.</p><h2 id="ComponentClasses-Injection">Injection</h2><p>Main Article: <a href="injection.html">Injection</a></p><p>Injection of dependencies occurs at the field level, via additional annotations. At runtime, fields that contain injections become read-only.</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 // inject a resource private ComponentResources componentResources;
Modified: websites/production/tapestry/content/component-events-faq.html ============================================================================== --- websites/production/tapestry/content/component-events-faq.html (original) +++ websites/production/tapestry/content/component-events-faq.html Thu Oct 27 17:20:26 2016 @@ -46,18 +46,13 @@ <div class="wrapper bs"> - <div id="navigation"><div class="nav"> -<ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul> -</div></div> + <div id="navigation"><div class="nav"><ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul></div></div> <div id="top"> - <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span> -<form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> - <input type="text" name="q"> - <input type="submit" value="Search"> -</form> - -</div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Events FAQ</h1></div></div> + <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span><form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> + <input type="text" name="q"> + <input type="submit" value="Search"> +</form></div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Events FAQ</h1></div></div> <div class="clearer"></div> </div> @@ -83,19 +78,13 @@ <div class="confluence-information-macro confluence-information-macro-information"><p class="title">Added in 5.2</p><span class="aui-icon aui-icon-small aui-iconfont-info confluence-information-macro-icon"></span><div class="confluence-information-macro-body"> </div></div> -<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"> - -<p>If you want to short-circuit this behavior and render a response directly, your component event handle method may return an instance of <a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/services/StreamPageContent.html";>StreamPageContent</a>. Tapestry will render the page as part of the event request and stream its content back to the client web browser, rather than sending the normal redirect.</p> -</div> +<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"><p>If you want to short-circuit this behavior and render a response directly, your component event handle method may return an instance of <a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/services/StreamPageContent.html";>StreamPageContent</a>. Tapestry will render the page as part of the event request and stream its content back to the client web browser, rather than sending the normal redirect.</p></div> <div class="confluence-information-macro confluence-information-macro-information"><p class="title">Added in 5.4</p><span class="aui-icon aui-icon-small aui-iconfont-info confluence-information-macro-icon"></span><div class="confluence-information-macro-body"> </div></div> -<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"> - -<p>Starting in release 5.4, Forms (by default) will NOT redirect after post if there are validation errors. This makes it possible to re-render the page, with error decorations, without requiring that the validation errors be stored in the session between requests ... and that means that the application can remain stateless much longer.</p> -</div> +<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"><p>Starting in release 5.4, Forms (by default) will NOT redirect after post if there are validation errors. This makes it possible to re-render the page, with error decorations, without requiring that the validation errors be stored in the session between requests ... and that means that the application can remain stateless much longer.</p></div> <h3 id="ComponentEventsFAQ-IspecifiedazoneinmyActionLink/EventLink,sowhydoesn'tmyeventfireviaajax(request.isXHR()isfalse)?">I specified a zone in my ActionLink/EventLink, so why doesn't my event fire via ajax (request.isXHR() is false)?</h3> Modified: websites/production/tapestry/content/component-events.html ============================================================================== --- websites/production/tapestry/content/component-events.html (original) +++ websites/production/tapestry/content/component-events.html Thu Oct 27 17:20:26 2016 @@ -46,18 +46,13 @@ <div class="wrapper bs"> - <div id="navigation"><div class="nav"> -<ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul> -</div></div> + <div id="navigation"><div class="nav"><ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul></div></div> <div id="top"> - <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span> -<form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> - <input type="text" name="q"> - <input type="submit" value="Search"> -</form> - -</div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Events</h1></div></div> + <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span><form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> + <input type="text" name="q"> + <input type="submit" value="Search"> +</form></div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Events</h1></div></div> <div class="clearer"></div> </div> @@ -69,73 +64,43 @@ </div> <div id="content"> - <div id="ConfluenceContent"><p><strong>Component events</strong> are Tapestry's way of conveying a user's interactions with the web page, such as clicking links and submitting forms, to designated methods in your page and component classes. When a component event is triggered, Tapestry calls the event handler method you've provided, if any, in the containing component's class.</p><div class="aui-label" style="float:right" title="Related Articles"> - - - - - - - - -<h3>Related Articles</h3> - -<ul class="content-by-label"><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="page-navigation.html">Page Navigation</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="page-life-cycle.html">Page Life Cycle</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-rendering.html">Component Rendering</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-events.html">Component Events</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-events-faq.html">Component Events FAQ</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="request-processing.html">Request Processing</a> - - - </div> - </li></ul> -</div><p>Let's look at a simple example. Here's a portion of the template for a page (let's call it "Review") that lists documents and lets a user click to edit any one of them.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Review.tml (partial)</b></div><div class="codeContent panelContent pdl"> + <div id="ConfluenceContent"><p><strong>Component events</strong> are Tapestry's way of conveying a user's interactions with the web page, such as clicking links and submitting forms, to designated methods in your page and component classes. When a component event is triggered, Tapestry calls the event handler method you've provided, if any, in the containing component's class.</p><div class="aui-label" style="float:right" title="Related Articles"><h3>Related Articles</h3><ul class="content-by-label"><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="page-navigation.html">Page Navigation</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="page-life-cycle.html">Page Life Cycle</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-rendering.html">Component Rendering</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-events.html">Component Events</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-events-faq.html">Component Events FAQ</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="request-processing.html">Request Processing</a> + </div> </li></ul></div><p>Let's look at a simple example. Here's a portion of the template for a page (let's call it "Review") that lists documents and lets a user click to edit any one of them.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Review.tml (partial)</b></div><div class="codeContent panelContent pdl"> <pre class="brush: xml; gutter: false; theme: Default" style="font-size:12px;"><p> Select document to edit: </p> <t:loop source="documents" value="document"> <div> @@ -155,9 +120,7 @@ void editDocument(int docId) <div class="confluence-information-macro confluence-information-macro-information"><p class="title">Added in 5.3</p><span class="aui-icon aui-icon-small aui-iconfont-info confluence-information-macro-icon"></span><div class="confluence-information-macro-body"> </div></div> -<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"> -<p>Starting in release 5.3, Tapestry will throw an exception if the component identified for the event handler method doesn't exist in the containing component's template. This helps prevent typos.</p> -</div><p>In the above example, the editDocument() method will be invoked when any event occurs in in the "edit" component (and has at least one context value).</p><p>For some components, more than one type of event can occur, in which case you will want to be more specific:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl"> +<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"><p>Starting in release 5.3, Tapestry will throw an exception if the component identified for the event handler method doesn't exist in the containing component's template. This helps prevent typos.</p></div><p>In the above example, the editDocument() method will be invoked when any event occurs in in the "edit" component (and has at least one context value).</p><p>For some components, more than one type of event can occur, in which case you will want to be more specific:</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;">@OnEvent(value="action", component="edit") void editDocument(int docId) { Modified: websites/production/tapestry/content/component-libraries.html ============================================================================== --- websites/production/tapestry/content/component-libraries.html (original) +++ websites/production/tapestry/content/component-libraries.html Thu Oct 27 17:20:26 2016 @@ -45,18 +45,13 @@ <div class="wrapper bs"> - <div id="navigation"><div class="nav"> -<ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul> -</div></div> + <div id="navigation"><div class="nav"><ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul></div></div> <div id="top"> - <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span> -<form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> - <input type="text" name="q"> - <input type="submit" value="Search"> -</form> - -</div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Libraries</h1></div></div> + <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span><form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> + <input type="text" name="q"> + <input type="submit" value="Search"> +</form></div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Libraries</h1></div></div> <div class="clearer"></div> </div> @@ -68,37 +63,19 @@ </div> <div id="content"> - <div id="ConfluenceContent"><p> </p><div class="confluence-information-macro confluence-information-macro-warning"><span class="aui-icon aui-icon-small aui-iconfont-error confluence-information-macro-icon"></span><div class="confluence-information-macro-body"><p>This page has not yet been fully updated for Tapestry 5.4. Things are different and simpler in 5.4 than in previous releases.</p></div></div><h1 id="ComponentLibraries-CreatingComponentLibraries">Creating Component Libraries</h1><p>Nearly every Tapestry application includes a least a couple of custom components, specific to the application. What's exciting about Tapestry is how easy it is to package components for reuse across many applications ... and the fact that applications using a component library need no special configuration.</p><div class="aui-label" style="float:right" title="Related Articles"> - - - - - - - - -<h3>Related Articles</h3> - -<ul class="content-by-label"><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-reference.html">Component Reference</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-libraries.html">Component Libraries</a> - - - </div> - </li></ul> -</div><p>A Tapestry component library consists of components (and optionally mixins, pages and component base classes). In addition, a component library will have a module that can define new services (needed by the components) or configure other services present in Tapestry. Finally, components can be packaged with <em>assets</em>: resources such as images, stylesheets and JavaScript libraries that need to be provided to the client web browser.</p><p>We're going to create a somewhat insipid component that displays a large happy face icon.</p><p>Tapestry doesn't mandate that you use any build system, but we'll assume for the moment that you are using Maven 2. In that case, you'll have a pom.xml file something like the following:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>pom.xml</b></div><div class="codeContent panelContent pdl"> + <div id="ConfluenceContent"><p> </p><div class="confluence-information-macro confluence-information-macro-warning"><span class="aui-icon aui-icon-small aui-iconfont-error confluence-information-macro-icon"></span><div class="confluence-information-macro-body"><p>This page has not yet been fully updated for Tapestry 5.4. Things are different and simpler in 5.4 than in previous releases.</p></div></div><h1 id="ComponentLibraries-CreatingComponentLibraries">Creating Component Libraries</h1><p>Nearly every Tapestry application includes a least a couple of custom components, specific to the application. What's exciting about Tapestry is how easy it is to package components for reuse across many applications ... and the fact that applications using a component library need no special configuration.</p><div class="aui-label" style="float:right" title="Related Articles"><h3>Related Articles</h3><ul class="content-by-label"><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-reference.html">Component Reference</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-libraries.html">Component Libraries</a> + </div> </li></ul></div><p>A Tapestry component library consists of components (and optionally mixins, pages and component base classes). In addition, a component library will have a module that can define new services (needed by the components) or configure other services present in Tapestry. Finally, components can be packaged with <em>assets</em>: resources such as images, stylesheets and JavaScript libraries that need to be provided to the client web browser.</p><p>We're going to create a somewhat insipid component that displays a large happy face icon.</p><p>Tapestry doesn't mandate that you use any build system, but we'll assume for the moment that you are using Maven 2. In that case, you'll have a pom.xml file something like the following:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>pom.xml</b></div><div class="codeContent panelContent pdl"> <pre class="brush: xml; gutter: false; theme: Default" style="font-size:12px;"><project> <modelVersion>4.0.0</modelVersion> <groupId>org.example</groupId> @@ -244,9 +221,7 @@ public class HappyModule <div class="confluence-information-macro confluence-information-macro-information"><p class="title">Added in 5.2</p><span class="aui-icon aui-icon-small aui-iconfont-info confluence-information-macro-icon"></span><div class="confluence-information-macro-body"> </div></div> -<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"> -<p>In version 5.2 and later, Tapestry automatically creates a mapping for assets inside your JAR. In the above example, the icon image will be exposed as <code>/assets/</code><em>application version</em><code>/happy/components/happy.jpg</code> (the application version number is incorporated into the URL). The "happy" portion is a virtual folder that maps to the library's root package (as folder <code>org/example/happylib</code> on the Java classpath). The application version is a configurable value.</p> -</div><h2 id="ComponentLibraries-Conclusion">Conclusion</h2><p>That's it! Autoloading plus the virtual folders for components and for assets takes care of all the issues related to components. Just build your JARs, setup the JAR Manifest, and drop them into your applications.</p></div> +<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"><p>In version 5.2 and later, Tapestry automatically creates a mapping for assets inside your JAR. In the above example, the icon image will be exposed as <code>/assets/</code><em>application version</em><code>/happy/components/happy.jpg</code> (the application version number is incorporated into the URL). The "happy" portion is a virtual folder that maps to the library's root package (as folder <code>org/example/happylib</code> on the Java classpath). The application version is a configurable value.</p></div><h2 id="ComponentLibraries-Conclusion">Conclusion</h2><p>That's it! Autoloading plus the virtual folders for components and for assets takes care of all the issues related to components. Just build your JARs, setup the JAR Manifest, and drop them into your applications.</p></div> </div> <div class="clearer"></div> Modified: websites/production/tapestry/content/component-parameters.html ============================================================================== --- websites/production/tapestry/content/component-parameters.html (original) +++ websites/production/tapestry/content/component-parameters.html Thu Oct 27 17:20:26 2016 @@ -46,18 +46,13 @@ <div class="wrapper bs"> - <div id="navigation"><div class="nav"> -<ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul> -</div></div> + <div id="navigation"><div class="nav"><ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul></div></div> <div id="top"> - <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span> -<form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> - <input type="text" name="q"> - <input type="submit" value="Search"> -</form> - -</div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Parameters</h1></div></div> + <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span><form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> + <input type="text" name="q"> + <input type="submit" value="Search"> +</form></div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Parameters</h1></div></div> <div class="clearer"></div> </div> @@ -69,111 +64,72 @@ </div> <div id="content"> - <div id="ConfluenceContent"><p><strong>Component parameters</strong> are the primary means for a component instance and its container to communicate with each other. Parameters are used to <em>configure</em> component instances.</p><div class="aui-label" style="float:right" title="Related Articles"> - - - - - - - - -<h3>Related Articles</h3> - -<ul class="content-by-label"><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-parameters.html">Component Parameters</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-templates.html">Component Templates</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="templating-and-markup-faq.html">Templating and Markup FAQ</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-classes.html">Component Classes</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="page-and-component-classes-faq.html">Page And Component Classes FAQ</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="enum-parameter-recipe.html">Enum Parameter Recipe</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="supporting-informal-parameters.html">Supporting Informal Parameters</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="default-parameter.html">Default Parameter</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-cheat-sheet.html">Component Cheat Sheet</a> - - - </div> - </li></ul> -</div><p>In the following example, <code>page</code> is a parameter of the <code>pagelink</code> component. The page parameter tells the pagelink component which page to go to when the user clicks on the rendered hyperlink:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl"> + <div id="ConfluenceContent"><p><strong>Component parameters</strong> are the primary means for a component instance and its container to communicate with each other. Parameters are used to <em>configure</em> component instances.</p><div class="aui-label" style="float:right" title="Related Articles"><h3>Related Articles</h3><ul class="content-by-label"><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-parameters.html">Component Parameters</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-templates.html">Component Templates</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="templating-and-markup-faq.html">Templating and Markup FAQ</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-classes.html">Component Classes</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="page-and-component-classes-faq.html">Page And Component Classes FAQ</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="enum-parameter-recipe.html">Enum Parameter Recipe</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="supporting-informal-parameters.html">Supporting Informal Parameters</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="default-parameter.html">Default Parameter</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-cheat-sheet.html">Component Cheat Sheet</a> + </div> </li></ul></div><p>In the following example, <code>page</code> is a parameter of the <code>pagelink</code> component. The page parameter tells the pagelink component which page to go to when the user clicks on the rendered hyperlink:</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;"><html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd"> <t:pagelink page="Index">Go Home</t:pagelink> </html></pre> </div></div><p>A component may have any number of parameters. Each parameter has a specific name, a specific Java type (which may be a primitive value), and may be <em>optional</em> or <em>required</em>.</p><p>Within a component class, parameters are declared by using the @<a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/Parameter.html";>Parameter</a> annotation on a private field, as we'll see below.</p><p><span class="confluence-anchor-link" id="ComponentParameters-bindingparameters"></span></p><h1 id="ComponentParameters-ParameterBindings">Parameter Bindings</h1><p>In Tapestry, a parameter is not a slot into which data is pushed: it is a <em>connection</em> between a field of the component (marked with the @Parameter annotation) and a property or resource of the component's container. (Components can be nested, so the container can be either the page or another component.)</p><div class="navmenu" style="float:right; backgr ound:white; margin:3px; padding:3px"> <div class="panel" style="border-width: 1px;"><div class="panelHeader" style="border-bottom-width: 1px;"><b>Contents</b></div><div class="panelContent"> <style type="text/css">/*<![CDATA[*/ -div.rbtoc1463689166558 {padding: 0px;} -div.rbtoc1463689166558 ul {list-style: disc;margin-left: 0px;} -div.rbtoc1463689166558 li {margin-left: 0px;padding-left: 0px;} +div.rbtoc1477588769065 {padding: 0px;} +div.rbtoc1477588769065 ul {list-style: disc;margin-left: 0px;} +div.rbtoc1477588769065 li {margin-left: 0px;padding-left: 0px;} -/*]]>*/</style><div class="toc-macro rbtoc1463689166558"> +/*]]>*/</style><div class="toc-macro rbtoc1477588769065"> <ul class="toc-indentation"><li><a href="#ComponentParameters-ParameterBindings">Parameter Bindings</a></li><li><a href="#ComponentParameters-BindingExpressions">Binding Expressions</a></li><li><a href="#ComponentParameters-@Parameterannotation">@Parameter annotation</a></li><li><a href="#ComponentParameters-Don'tusethe${...}syntax!">Don't use the ${...} syntax!</a></li><li><a href="#ComponentParameters-InformalParameters">Informal Parameters</a></li><li><a href="#ComponentParameters-ParametersAreBi-Directional">Parameters Are Bi-Directional</a></li><li><a href="#ComponentParameters-InheritedParameterBindings">Inherited Parameter Bindings</a></li><li><a href="#ComponentParameters-ComputedParameterBindingDefaults">Computed Parameter Binding Defaults</a></li><li><a href="#ComponentParameters-UnboundParameters">Unbound Parameters</a></li><li><a href="#ComponentParameters-ParameterTypeCoercion">Parameter Type Coercion</a></li><li><a href="#ComponentParameters-ParameterNames"> Parameter Names</a></li><li><a href="#ComponentParameters-DeterminingifBound">Determining if Bound</a></li><li><a href="#ComponentParameters-PublishingParameters">Publishing Parameters</a></li></ul> </div> </div></div></div> <p>The connection between a component and a property (or resource) of its container is called a <em>binding</em>. The binding is two-way: the component can read the bound property by reading its parameter field. Likewise, a component that updates its parameter field will update the bound property.</p><p>This is important in a lot of cases; for example a TextField component can read <em>and update</em> the property bound to its value parameter. It reads the value when rendering, but updates the value when the form is submitted.</p><p>The component listed below is a looping component; it renders its body a number of times, defined by its <code>start</code> and <code>end</code> parameters (which set the boundaries of the loop). The component can update a <code>result</code> parameter bound to a property of its container; it will automatically count up or down depending on whether <code>start</code> or <code>end</code> is larger.</p><div class="code panel pdl" st yle="border-width: 1px;"><div class="codeContent panelContent pdl"> Modified: websites/production/tapestry/content/component-rendering.html ============================================================================== --- websites/production/tapestry/content/component-rendering.html (original) +++ websites/production/tapestry/content/component-rendering.html Thu Oct 27 17:20:26 2016 @@ -46,18 +46,13 @@ <div class="wrapper bs"> - <div id="navigation"><div class="nav"> -<ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul> -</div></div> + <div id="navigation"><div class="nav"><ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul></div></div> <div id="top"> - <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span> -<form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> - <input type="text" name="q"> - <input type="submit" value="Search"> -</form> - -</div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Rendering</h1></div></div> + <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span><form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> + <input type="text" name="q"> + <input type="submit" value="Search"> +</form></div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Rendering</h1></div></div> <div class="clearer"></div> </div> @@ -69,82 +64,49 @@ </div> <div id="content"> - <div id="ConfluenceContent"><p><strong>Rendering of components</strong> in Tapestry 5 is based on a <em>state machine</em> and a <em>queue</em> (instead of the tail recursion used in Tapestry 4). This breaks the rendering process up into tiny pieces that can easily be implemented or overridden. Don't worry, in practice, writing components requires a breathtakingly small amount of code.</p><div class="aui-label" style="float:right" title="Related Articles"> - - - - - - - - -<h3>Related Articles</h3> - -<ul class="content-by-label"><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="content-type-and-markup.html">Content Type and Markup</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="page-navigation.html">Page Navigation</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="page-life-cycle.html">Page Life Cycle</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-rendering.html">Component Rendering</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-events.html">Component Events</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="component-events-faq.html">Component Events FAQ</a> - - - </div> - </li><li> - <div> - <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> </div> - - <div class="details"> - <a href="request-processing.html">Request Processing</a> - - - </div> - </li></ul> -</div><h2 id="ComponentRendering-RenderingPhases">Rendering Phases</h2><p>The rendering of each component is divided into a number of phases, illustrated below.</p><p><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image" src="component-rendering.data/tapestry_render_phases.png"></span><br clear="none"> Each of the orange phases (SetupRender, BeginRender, BeforeRenderBody, etc.) corresponds to an annotation you may place on one or more methods of your class. The annotation directs Tapestry to invoke your method as part of that phase.</p><p>Methods marked with these annotations are called <strong>render phase methods</strong>.</p><p>Your methods may be void, or return a boolean value. Returning a value can force phases to be skipped, or even be re-visited. In the diagram, solid lines show the normal processing path. Dashed lines are alternate flows that are triggered when your render phase methods return false instead of true (or void).</p><p>Render pha se methods may take no parameters, or may take a parameter of type <a href="dom.html">MarkupWriter</a>. The methods can have any visibility you like ... typically, package private is used, as this visibility makes it possible to unit test your code (from within the same Java package) without making the methods part of the component's <em>public</em> API.</p><p>All Render phase methods are <em>optional</em>; a default behavior is associated with each phase.</p><div class="table-wrap"><table class="confluenceTable"><tbody><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Annotation</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Method Name</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>When Called</p></th></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><strong><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/SetupRender.html";>@SetupRender</a></strong></p></td><td colspan="1" rowspa n="1" class="confluenceTd"><p>setupRender()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>When initial setup actions, if any, are needed</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><strong><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/BeginRender";>@BeginRender</a></strong></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>beginRender()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>When Tapestry is ready for the component's start tag, if any, to be rendered</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/BeforeRenderTemplate";>@BeforeRenderTemplate</a></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>beforeRenderTemplate()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>Before Tapestry renders the component's tem plate, if any</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/BeforeRenderBody";>@BeforeRenderBody</a></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>beforeRenderBody()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>Before Tapestry renders the body of the component, if any</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/AfterRenderBody";>@AfterRenderBody</a></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>afterRenderBody()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>After Tapestry renders the body of the component, if any, but before the rest of the component's template is rendered</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><a class="external-link" hre f="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/AfterRenderTemplate";>@AfterRenderTemplate</a></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>afterRenderTemplate()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>After Tapestry finishes rendering the component's template, if any</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><strong><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/AfterRender";>@AfterRender</a></strong></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>afterRender()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>After Tapestry has finished rendering both the template and body of the component</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><strong><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/CleanupRender";>@CleanupRender</a></str ong></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>cleanupRender()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>When final cleanup actions, if any, are needed</p></td></tr></tbody></table></div><p>The large number of phases reflects the need for precise control of components from <a href="component-mixins.html">component mixins</a>. Several of the phases exist almost exclusively for mixins.</p><p>Generally, your code will use the SetupRender, BeginRender, AfterRender and CleanupRender phases ... often just one or two of those.</p><h2 id="ComponentRendering-AnExample">An Example</h2><p>Here's the source for a looping component that counts up or down between two values, renders its body a number of times, and stores the current index value in a parameter:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl"> + <div id="ConfluenceContent"><p><strong>Rendering of components</strong> in Tapestry 5 is based on a <em>state machine</em> and a <em>queue</em> (instead of the tail recursion used in Tapestry 4). This breaks the rendering process up into tiny pieces that can easily be implemented or overridden. Don't worry, in practice, writing components requires a breathtakingly small amount of code.</p><div class="aui-label" style="float:right" title="Related Articles"><h3>Related Articles</h3><ul class="content-by-label"><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="content-type-and-markup.html">Content Type and Markup</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="page-navigation.html">Page Navigation</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="page-life-cycle.html">Page Life Cycle</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-rendering.html">Component Rendering</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-events.html">Component Events</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="component-events-faq.html">Component Events FAQ</a> + </div> </li><li> + <div> + <span class="icon aui-icon aui-icon-small aui-iconfont-page-default" title="Page">Page:</span> + </div> + <div class="details"> + <a href="request-processing.html">Request Processing</a> + </div> </li></ul></div><h2 id="ComponentRendering-RenderingPhases">Rendering Phases</h2><p>The rendering of each component is divided into a number of phases, illustrated below.</p><p><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image" src="component-rendering.data/tapestry_render_phases.png"></span><br clear="none"> Each of the orange phases (SetupRender, BeginRender, BeforeRenderBody, etc.) corresponds to an annotation you may place on one or more methods of your class. The annotation directs Tapestry to invoke your method as part of that phase.</p><p>Methods marked with these annotations are called <strong>render phase methods</strong>.</p><p>Your methods may be void, or return a boolean value. Returning a value can force phases to be skipped, or even be re-visited. In the diagram, solid lines show the normal processing path. Dashed lines are alternate flows that are triggered when your render phase methods return false instead of true (or void ).</p><p>Render phase methods may take no parameters, or may take a parameter of type <a href="dom.html">MarkupWriter</a>. The methods can have any visibility you like ... typically, package private is used, as this visibility makes it possible to unit test your code (from within the same Java package) without making the methods part of the component's <em>public</em> API.</p><p>All Render phase methods are <em>optional</em>; a default behavior is associated with each phase.</p><div class="table-wrap"><table class="confluenceTable"><tbody><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Annotation</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Method Name</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>When Called</p></th></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><strong><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/SetupRender.html";>@SetupRender</a></strong></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>setupRender()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>When initial setup actions, if any, are needed</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><strong><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/BeginRender";>@BeginRender</a></strong></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>beginRender()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>When Tapestry is ready for the component's start tag, if any, to be rendered</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/BeforeRenderTemplate";>@BeforeRenderTemplate</a></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>beforeRenderTemplate()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>Before Tapestry renders the component's template, if any</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/BeforeRenderBody";>@BeforeRenderBody</a></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>beforeRenderBody()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>Before Tapestry renders the body of the component, if any</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/AfterRenderBody";>@AfterRenderBody</a></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>afterRenderBody()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>After Tapestry renders the body of the component, if any, but before the rest of the component's template is rendered</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><a class= "external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/AfterRenderTemplate";>@AfterRenderTemplate</a></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>afterRenderTemplate()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>After Tapestry finishes rendering the component's template, if any</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><strong><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/AfterRender";>@AfterRender</a></strong></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>afterRender()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>After Tapestry has finished rendering both the template and body of the component</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p><strong><a class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/CleanupRender";>@Cle anupRender</a></strong></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>cleanupRender()</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>When final cleanup actions, if any, are needed</p></td></tr></tbody></table></div><p>The large number of phases reflects the need for precise control of components from <a href="component-mixins.html">component mixins</a>. Several of the phases exist almost exclusively for mixins.</p><p>Generally, your code will use the SetupRender, BeginRender, AfterRender and CleanupRender phases ... often just one or two of those.</p><h2 id="ComponentRendering-AnExample">An Example</h2><p>Here's the source for a looping component that counts up or down between two values, renders its body a number of times, and stores the current index value in a parameter:</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;">package org.example.app.components; import org.apache.tapestry5.annotations.Parameter; Modified: websites/production/tapestry/content/component-report.html ============================================================================== --- websites/production/tapestry/content/component-report.html (original) +++ websites/production/tapestry/content/component-report.html Thu Oct 27 17:20:26 2016 @@ -44,18 +44,13 @@ <div class="wrapper bs"> - <div id="navigation"><div class="nav"> -<ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul> -</div></div> + <div id="navigation"><div class="nav"><ul class="alternate"><li><a href="index.html">Home</a></li><li><a href="getting-started.html">Getting Started</a></li><li><a href="documentation.html">Documentation</a></li><li><a href="download.html">Download</a></li><li><a href="about.html">About</a></li><li><a href="community.html">Community</a></li><li><a class="external-link" href="http://www.apache.org/";>Apache</a></li><li><a class="external-link" href="http://www.apache.org/foundation/sponsorship.html";>Sponsorship</a></li><li><a class="external-link" href="http://www.apache.org/foundation/thanks.html";>Thanks</a></li></ul></div></div> <div id="top"> - <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span> -<form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> - <input type="text" name="q"> - <input type="submit" value="Search"> -</form> - -</div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Report</h1></div></div> + <div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis & blogs:</span><form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html";> + <input type="text" name="q"> + <input type="submit" value="Search"> +</form></div><div class="emblem" style="float:left"><p><a href="index.html"><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image confluence-external-resource" src="http://tapestry.apache.org/images/tapestry_small.png"; data-image-src="http://tapestry.apache.org/images/tapestry_small.png";></span></a></p></div><div class="title" style="float:left; margin: 0 0 0 3em"><h1 id="SmallBanner-PageTitle">Component Report</h1></div></div> <div class="clearer"></div> </div> @@ -94,8 +89,7 @@ <div class="confluence-information-macro confluence-information-macro-information"><p class="title">Added in 5.3</p><span class="aui-icon aui-icon-small aui-iconfont-info confluence-information-macro-icon"></span><div class="confluence-information-macro-body"> </div></div> -<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"> -<p> </p></div><p>In version 5.3 the configuration of the Maven plugin changed in a backward incompatible way. The configuration expects the <em><rootPackages></em> element, which may have several <em><rootPackage></em> elements. You should change the plugin configuration as shown below or you can still use the 5.2.4 version of the plugin without to change anything.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl"> +<div style="border-right: 20px solid #D8E4F1;border-left: 20px solid #D8E4F1;"><p> </p></div><p>In version 5.3 the configuration of the Maven plugin changed in a backward incompatible way. The configuration expects the <em><rootPackages></em> element, which may have several <em><rootPackage></em> elements. You should change the plugin configuration as shown below or you can still use the 5.2.4 version of the plugin without to change anything.</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;"><plugin> <groupId>org.apache.tapestry</groupId> <artifactId>tapestry-component-report</artifactId>
![http://tapestry.apache.org/images/tapestry_small.png"](http://tapestry.apache.org/images/tapestry_small.png"){kind=link}