Getting Started
How to create a page
First of all, create a page in XHTML file format, a file with a .xhtml extension and declared the necessary Namespaces.
<!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:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:fn="http://java.sun.com/jsp/jstl/functions"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:crm="http://java.sun.com/jsf/composite/crm">
</html>
Define the template of the page in a ui:composition tag.
<ui:composition template=""></ui:composition>
By default a template provides the base interface layout of the page (header, footer, topbar, main menu, content) as well as the following tags:
- "managedBean" parameter - contains the name of the managed bean that will be used from template
<ui:param name="managedBean" value=""></ui:param>
- "back-button" placeholder - defines the back button of the page that will be inserted in the left side of the topbar before the title
<ui:define name="back-button"></ui:define>
"title" placeholder - defines the title of the page that will be inserted n the left side of the topbar
<ui:define name="title"></ui:define>
"viewname" placeholder - defines the view name in breadcrumb of the page
<ui:define name="viewname"></ui:define>
"actions" placeholder - defines the actions of the page that will be inserted in the right side of the topbar
<ui:define name="actions"></ui:define>
"content" placeholder - defines the actual content of the page
<ui:define name="content"></ui:define>
Namespaces
The following namespaces should be defined in html root element of a page.
Tag Library | URI | Prefix | Contents |
|---|---|---|---|
| XHTML namespace | http://www.w3.org/1999/xhtml | Tags for xhtml | |
| JavaServer Faces Facelets Tag Library | http://xmlns.jcp.org/jsf/facelets | ui: | Tags for templating |
| PrimeFaces components | http://primefaces.org/ui | p: | Tags for PrimeFaces components |
| JavaServer Faces Core Tag Library | http://java.sun.com/jsf/core | f: | Tags for JavaServer Faces custom actions that are independent of any particular render kit |
| Pass-through Attributes Tag Library | http://xmlns.jcp.org/jsf/passthrough | p: | Tags to support HTML5-friendly markup |
| JavaServer Faces HTML Tag Library | http://java.sun.com/jsf/html | h: | JavaServer Faces component tags for all UIComponent objects |
| JSTL Functions Tag Library | http://java.sun.com/jsp/jstl/functions | fn: | JSTL 1.2 Functions Tags |
| JSTL Core Tag Library | http://java.sun.com/jsp/jstl/core | c: | JSTL 1.2 Core Tags |
| CRM Composite Components Tag Library | http://java.sun.com/jsf/composite/crm | crm: | Tags for CRM Components |
Templates
The available templates are:
- summary_template.xhtml - it is used for a summary page
- data_entry_template.xhtml - it is used for a data entry page
Managed Bean
A typical JavaServer Faces application includes one or more managed beans, each of which can be associated with the components used in a particular page.
A managed bean for summary pages must extend SummaryView class and for data entry pages must extend DataEntryView class.
@ManagedBean(name = "summaryManagedBeanView", eager = true)
@ViewScoped
public class SummaryManagedBeanView extends SummaryView {
}
@ManagedBean(name = "dataEntryManagedBeanView", eager = true)
@ViewScoped
public class DataEntryManagedBeanView extends DataEntryView{
}
Class SummaryView
SummaryView class implements commonly used functions for summary pages.
Class DataEntryView
DataEntryView class implements commonly used functions for data entry pages.