In this example we will learn about the JSF 2 composite renderFacet tag.
JSF 2 composite renderFacet
In this example we will learn about the JSF 2 composite renderFacet tag.
<composite:renderFacet> tag of JSF 2 composite tag library is used to specify a facet inside the <composite:implemntation> tag that the facet will be rendered at that point. The <composite:renderFacet> attribute 'name' must be equal to the name of facet declared inside the <composite:interface> tag to use on the using page.
Attributes of JSF 2 composite renderFacet tag
- name : This is a required attribute. Value of this attribute can be of type java.lang.String. This attribute is used to specify the name of a facet. Name of facet must be equal to the name appeared in the <f: : facet> tag on the using page.
- required : This is not a required attribute. Value of this attribute can be of type boolean and it can be set to true if value of this attribute is must provided by the page author.
Example :
Here an example is being given for you which will demonstrate how to use JSF 2 composite renderFacet tag in the applications. In this example I have created a composite component named renderFacetComponent.xhtml. In this composite component I have used the <composite:interface> tag inside which I have declared the facets and an attribute. To use these facets and attribute on the using page they should be specified in the composite component page inside the <composite:implementation> tag. To specify the facets I have used the renderFacet tag and put the value of its 'name' attribute equal to the name of facets. Then created a using page of this composite component and used the <f:facet> tag to use the facets.
Directory Structure
renderFacetComponent.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!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:f="http://java.sun.com/jsf/core"
xmlns:composite="http://java.sun.com/jsf/composite"
>
<composite:interface>
<composite:facet name="f1" />
<composite:facet name="f2" />
<composite:attribute name="bike" required="true" />
</composite:interface>
<composite:implementation>
<h:panelGrid border="1" columns="3" rules="all">
<composite:renderFacet name="f1" required="true"/>
<h:outputText value="#{cc.attrs.bike}" />
<composite:renderFacet name="f2" />
</h:panelGrid>
</composite:implementation>
</html>
renderFacetExample.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:f="http://java.sun.com/jsf/core" xmlns:d="http://java.sun.com/jsf/composite/compositeComponent" > <body> <f:view> <h:form> <d:renderFacetComponent bike="TVS Apache"> <f:facet name="f1"> <h:outputText value="1."/> </f:facet> <f:facet name="f2"> <h:outputText value="180 cc" /> </f:facet> </d:renderFacetComponent> </h:form> </f:view> </body> </html>
web.xml
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0"> <display-name>jsfCompositeRenderFacet</display-name> <welcome-file-list> <welcome-file>renderFacetExample.xhtml</welcome-file> </welcome-file-list> <servlet> <servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>/faces/*</url-pattern> <url-pattern>*.jsf</url-pattern> <url-pattern>*.xhtml</url-pattern> </servlet-mapping> <context-param> <description>State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2</description> <param-name>javax.faces.STATE_SAVING_METHOD</param-name> <param-value>client</param-value> </context-param> <context-param> <param-name>javax.servlet.jsp.jstl.fmt.localizationContext</param-name> <param-value>resources.application</param-value> </context-param> <listener> <listener-class>com.sun.faces.config.ConfigureListener</listener-class> </listener> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*.faces</url-pattern> </servlet-mapping> </web-app>
How To execute this example
To execute this example you can download a WAR file example form here and import this war file into your eclipse by File -> import -> web -> war file and simply execute this example by selecting the imported project as follows :- Select your project -> Right Click -> Run As -> Run On Server.
Output :
After successfully execution of this example output will be as follows :
And the HTML code will be viewed as follows :
<!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"> <body> <form id="j_idt3" name="j_idt3" method="post" action="/jsfCompositeRenderFacet/renderFacetExample.xhtml" enctype="application/x-www-form-urlencoded"> <input type="hidden" name="j_idt3" value="j_idt3" /> <table border="1" rules="all"> <tbody> <tr> <td>1.</td> <td>TVS Apache</td> <td>180 cc</td> </tr> </tbody> </table> <input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="H4sIAAAAAAAAAJVSz2tTQRCeviStjVViosUi9WIRBHlBbEENYkOb0GBaA6lg8aCbZJq8uHlv3Z2XvvRQ6EUPXsQfB6GiBw8eevMvEA+CoKBHT+Ldo/Tq7kuatNAeHNjZx76Zb+b7Zrb/QEwoCSearM1snxxuLzDVWGQiNvLz46fx+98jYOUhzj1Wy7MqebIAo9SQqBoerwXixiwYG1s7on1CnwjBseY9p0aXr4XXtC8hdbcYwnPm1u1blSZWKfP02503CXWBWwCB0Hkxoc1/CBsQMSgbEqZNTmCvsioqu+q1hOeiS/btwhJrOW59znOJOS7KqZL0BErq3MSOgp4lNayE44OyOddv7f0pCIY5U1So9dmHcQWXsI4y+fvtu53Nx1csGCpArM24jxovMYhb8lsVlI+2X04effHryS6LqIHt0u9z2c8sppnNHMZsbvd7H6eSdNqMcG/3Bm2E4CQjkk7FJ1TLDUZZiWUkzSc1mGZWStYpOoqCzR+Trz6z1xHDKKqcdQw7ttaixuuk8wd3VSZde0EPG2WZtVGufPlw/fnW10ULrCKMVrWGSg8ECZLhkNNGnXRZt+XWM0WIK51TCzEIxrsRjpcuo3QYd9ZZhWMmEKJtCKWU8ae0hGd1eVv5bq8Z47kmZmdLpWIhNx9oDe3/0/AA8eID8cLC0Nvl4XCXzRkyz2e0NDOH9OO0BLfncZX5nPLdx6msELyz7D1A9+/7iytbs83ZMbMca+dgIi3R1TKaSMoFTCejHTSoxXWpqzunn00EZi1jZn8u9RfGEiL4B8jJS96mAwAA" autocomplete="off" /> </form> </body> </html>
[ 0 ] Comments