Delegate to Block

When a template becomes complex or cluttered in a way that makes its structure or sequence of elements difficult, consider using Delegate and Block.
This is block A.
This is block B.
This is block C. The project is JumpStart.
This is block B.
This is block A.
They provide great flexibility in how and what gets rendered, especially when combined with If and Loop.
For a more programmatic approach, see the later example Delegate to Renderable.

References: Conditional and Looping Components, Delegate, t:block, Block, Switching Cases, Principle 1 - Static Structure, Dynamic Behavior.

Home


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- We need a doctype to allow us to use special characters like &nbsp; 
     We use a "strict" DTD to make IE follow the alignment rules. -->
     
<html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_4.xsd">
<body class="container">
    <h3>Delegate to Block</h3>

    When a template becomes complex or cluttered in a way that makes its structure or sequence of elements difficult, consider using Delegate and Block.

    <div class="eg">
        <t:delegate to="block:blockA"/>
        <t:delegate to="block:blockB"/>
        <t:delegate to="block:blockC" project="JumpStart"/>
        <t:delegate to="block:blockB"/>
        <t:delegate to="block:blockA"/>
    </div>

    They provide great flexibility in how and what gets rendered, especially when combined with If and Loop. <br/>
    For a more programmatic approach, see the later example Delegate to Renderable.<br/><br/>

    <t:block id="blockA">
        <div style="margin: 2px; padding: 10px; background-color: #f8f8f8;">
            This is block A.
        </div>
    </t:block>
    <t:block id="blockB">
        <div style="margin: 2px; padding: 10px; background-color: #f0f0f0;">
            This is block B.
        </div>
    </t:block>
    <t:block id="blockC">
        <div style="margin: 2px; padding: 10px; background-color: #e8e8e8;">
            This is block C. The project is ${var:project}.
        </div>
    </t:block>
    
    References: 
    <a href="http://tapestry.apache.org/component-reference.html#ComponentReference-ConditionalandLoopingComponents">Conditional and Looping Components</a>, 
    <a href="http://tapestry.apache.org/5.4/apidocs/org/apache/tapestry5/corelib/components/Delegate.html">Delegate</a>, 
    <a href="http://tapestry.apache.org/component-templates.html#ComponentTemplates-The%3Ct%3Ablock%3EElement">t:block</a>, 
    <a href="http://tapestry.apache.org/5.4/apidocs/org/apache/tapestry5/Block.html">Block</a>, 
    <a href="http://tapestry.apache.org/switching-cases.html">Switching Cases</a>, 
    <a href="http://tapestry.apache.org/principles.html#Principles-Principle1StaticStructure%2CDynamicBehavior">Principle 1 - Static Structure, Dynamic Behavior</a>.<br/><br/>

    <t:pagelink page="Index">Home</t:pagelink><br/><br/>
    
    <t:tabgroup>
        <t:sourcecodetab src="/web/src/main/java/jumpstart/web/pages/examples/lang/DelegateToBlock.tml"/>
        <t:sourcecodetab src="/web/src/main/java/jumpstart/web/pages/examples/lang/DelegateToBlock.java"/>
        <t:sourcecodetab src="/web/src/main/resources/META-INF/assets/css/examples/plain.css"/>
    </t:tabgroup>
</body>
</html>


package jumpstart.web.pages.examples.lang;

import org.apache.tapestry5.annotations.Import;

@Import(stylesheet = "css/examples/plain.css")
public class DelegateToBlock {

}


.eg {
                margin: 20px 0;
                padding: 14px;
                border: 1px solid #ddd;
                border-radius: 6px;
                -webkit-border-radius: 6px;
                -mox-border-radius: 6px;
}