Component Around Content

A component can have content between its start and end tags. The component outputs that content when it reaches a t:body directive in its template.
I am content surrounded by component examples.component.bolditalicdisplaywithcontent.
I was rendered when it reached a t:body directive in its template.
server time: Sat Dec 21 14:55:57 UTC 2024.
Refresh

References: t:body.

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>Component Around Content</h3>

    A component can have content between its start and end tags. The component outputs that content when it reaches a 
    <em>t:body</em> directive in its template.
    
    <div class="eg">
        <t:examples.component.bolditalicdisplaywithcontent value="message">
            I am content surrounded by component <code>examples.component.bolditalicdisplaywithcontent</code>.<br/>
            I was rendered when it reached a <code>t:body</code> directive in its template.<br/>
        </t:examples.component.bolditalicdisplaywithcontent>
    </div>
    
    <t:pagelink t:page="examples/component/ComponentAroundContent" href="#">Refresh</t:pagelink><br/><br/>
    
    References: 
    <a href="http://tapestry.apache.org/component-templates.html#ComponentTemplates-The%3Ct%3Abody%3EElement">t:body</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/component/ComponentAroundContent.tml"/>
        <t:sourcecodetab src="/web/src/main/java/jumpstart/web/pages/examples/component/ComponentAroundContent.java"/>
        <t:sourcecodetab src="/web/src/main/resources/META-INF/assets/css/examples/plain.css"/>
        <t:sourcecodetab src="/web/src/main/java/jumpstart/web/components/examples/component/BoldItalicDisplayWithContent.tml"/>
        <t:sourcecodetab src="/web/src/main/java/jumpstart/web/components/examples/component/BoldItalicDisplayWithContent.java"/>
        <t:sourcecodetab src="/web/src/main/resources/META-INF/assets/css/examples/bolditalicdisplay.css"/>
    </t:tabgroup>
</body>
</html>



package jumpstart.web.pages.examples.component;

import org.apache.tapestry5.annotations.Import;

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

    public String getMessage() {
        return "server time: " + new java.util.Date() + ".";
    }

}



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



<html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_4.xsd">
<t:content>
    <div class="bold-etc">
        <!-- t:body is a directive that says "output the content that I surround". -->
        <t:body/>
        <strong><em>${value}</em></strong>
    </div>
</t:content>
</html>



package jumpstart.web.components.examples.component;

import org.apache.tapestry5.annotations.Import;
import org.apache.tapestry5.annotations.Parameter;
import org.apache.tapestry5.annotations.Property;

@Import(stylesheet = "css/examples/bolditalicdisplay.css")
public class BoldItalicDisplayWithContent {

    // Parameters

    @Parameter(required = true)
    @Property
    private String value;

}



.bold-etc {
                border: 20px solid #f5f5dc;
}