In the previous article we spoke about annoying issue of the Mojarra 2.0.0 PR when the empty attributes are rendered to the final html code. The issue was posted to the Mojarra project: https://javaserverfaces.dev.java.net/issues/show_bug.cgi?id=940
Now, it is fixed. Let's take a new version of Mojarra 2.0.0 . It is not a PR release, but the SNAPSHOT dated 01/27/08.
The SNAPSHOT has two more surprises.
First, we can use c:if to have a conditional insert now. We speak about it in the Part 2.
Second, there is no composite:insertChildren any more. This tag was replaced with composite:renderUsingPageChildren. It is more correct semantically, but requires some time to memorize.
Ok, this is code of the component that works:
<!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:ui="http://java.sun.com/jsf/facelets" xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:composite="http://java.sun.com/jsf/composite"> <head> <title>panel</title> </head> <body> <composite:interface> <composite:attribute name="style" required="false"/> <composite:attribute name="styleClass" required="false"/> <composite:attribute name="headerClass" required="false"/> <composite:attribute name="bodyClass" required="true"/> </composite:interface> <composite:implementation> <h:outputStylesheet name="rich/css/panel.css" /> <div class="rich-panel #{compositeComponent.attrs.styleClass}" style="#{compositeComponent.attrs.style}" onclick="#{compositeComponent.attrs.onclick}" ondblclick="#{compositeComponent.attrs.ondblclick}" onkeydown="#{compositeComponent.attrs.onkeydown}" onkeypress="#{compositeComponent.attrs.onkeypress}" onkeyup="#{compositeComponent.attrs.onkeyup}" onmousedown="#{compositeComponent.attrs.onmousedown}" onmousemove="#{compositeComponent.attrs.onmousemove}" onmouseout="#{compositeComponent.attrs.onmouseout}" onmouseover="#{compositeComponent.attrs.onmouseover}" onmouseup="#{compositeComponent.attrs.onmouseup}"> <c:if test="#{! empty compositeComponent.facets.header}"> <div class="rich-panel-header #{compositeComponent.attrs.headerClass}"> <composite:insertFacet name="header"/> </div> </c:if> <div class="rich-panel-body #{compositeComponent.attrs.bodyClass}" > <composite:renderUsingPageChildren /> </div> </div> </composite:implementation> </body> </html>
This is a deployed example: http://livedemo.exadel.com/richfaces4-panel-4a/home.jsf
If you look at the result html code, you can see what no more empty attributes inserted.