-
Notifications
You must be signed in to change notification settings - Fork 91
JSF Templating
JavaServer Faces (JSF) offers a powerful templating system that promotes code reuse and modularity. It uses Facelets as its default templating system, allowing developers to leverage HTML-like templates in their applications.
A JSF template, often saved with an .xhtml
extension, serves as a blueprint for web pages, defining their basic layout and structure. The typical JSF template includes placeholders for content that will be defined later.
Here's a simple example of a JSF template:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets">
<body>
<ui:insert name="content"/>
</body>
</html>
In this template, <ui:insert name="content"/>
acts as a placeholder for dynamic content.
A JSF template client is a web page that uses a template for its layout. It fulfills the placeholders defined in the template with actual content.
In JSF, there are two important tags: html
and ui:composition
.
-
<html>
tag: This is the root tag for an HTML document. -
<ui:composition>
tag: This Facelets tag defines a template client page. It may optionally reference a template file (template
attribute) and can contain<ui:define>
tags to provide content for placeholders.
To link a template to a client page, you use the <ui:composition>
tag with a template
attribute. The template
attribute's value should be the path to the template file.
Example:
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
template="/WEB-INF/templates/basicTemplate.xhtml">
<ui:define>
is a Facelets tag used in a template client to provide content for placeholders (<ui:insert>
tags) in the template. The name
attribute should match the name specified in the <ui:insert>
tag of the template.
Example:
<ui:define name="content">
<h1>Welcome to our website!</h1>
</ui:define>
<ui:insert>
is a Facelets tag used in a template to define a placeholder for content. The name
attribute identifies the placeholder. A template client can then fill these placeholders with actual content using <ui:define>
tags.
Example:
<ui:insert name="content"/> <!-- This is a placeholder -->
In a template client:
<ui:define name="content">
<!-- The content here will replace the placeholder in the template -->
</ui:define>
Remember, JSF templating system is about building reusable and maintainable UI components and layouts. By mastering <ui:insert>
, <ui:define>
, and <ui:composition>
, you can construct powerful, dynamic web pages.