|
The UI Composition tag is a templating tag that wraps content to be included
in another Facelet. Any content outside of the UI Composition tag will be
ignored by the Facelets view handler. Any content inside of the UI Composition
tag will be included when another Facelets page includes the page containing
this UI Composition tag. See also ui:include.
UI Design Tip:
If the template attribute is specified, the JSF page containing the
composition tag will display the content of the associated template. If the
composition tag contains ui:define tags, the content
of these tags will be inserted into the template where matching ui:insert tags can be found.
The template page can use a nameless ui:insert tag to insert all the content
within the composition tag.
Facelets Template (template.xhtml)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<title><ui:insert name="title" /></title>
</h:head>
<body>
<h2>
<ui:insert name="header" />
</h2>
<ui:insert name="message" />
</body>
</html>
This example was formatted by JSFToolbox for Dreamweaver.
Facelets Template Client (client.xhtml)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head />
<body>
<ui:composition template="template.xhtml">
<ui:define name="title">
Welcome
</ui:define>
<ui:define name="header">
Hello World
</ui:define>
<ui:define name="message">
How are you today?
</ui:define>
</ui:composition>
</body>
</html>
This example was formatted by JSFToolbox for Dreamweaver.
Rendered Output
HTML Output
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Welcome</title>
</head>
<body>
<h2>Hello World</h2>
How are you today?
</body>
</html>
|
