|
Looking at the source code of pages rendered by the Java Server Faces run-time you can see that most
components have an id. They have this attribute assigned even you don’t explicitly define it for
the Java Server Faces tags.
Also, Java Server Faces has its own naming convention for the component id. While you might specify
something like id="myId" for h:inputText, the rendered code will contain something like
id="_id0:myId". This is done to ensure the uniqueness of each element in the Java Server Faces Component
tree. It is especially important for components that process user input. Having the full control
over the rendered code you can assign any value for id, but we recommend you to follow the
rules of the game.
In step 3, we will assign a value for our component that will be the same value that Java Server Faces runtime
assigns for it.
Any attribute should be present in the tag library definition file. So, open our ticker.tld file
and add the following code snippet next to the other tag attributes:
<attribute>
<name>id</name>
</attribute>
Add the following code marked with bold in the encodeBegin method of the UITicker.java:
public void encodeBegin(FacesContext context) throws IOException {
ResponseWriter writer = context.getResponseWriter();
writer.startElement("div", this);
writer.writeAttribute("id", getClientId(context), null);
String style = (String)getAttributes().get("style");
if (style!=null)
writer.writeAttribute("style", style, null);
String styleClass = (String)getAttributes().get("styleClass");
if (styleClass!=null)
writer.writeAttribute("class", styleClass, null);
}
|
When you run the application at this point, you can see that the id attribute of the <div> tag
is assigned. Because the
Provide your id for the <d:ticker> component and run the application again. Then, you will
see that the id you have for the rendered code is the same that you assign. This happens because
the <d:ticker> is a root element of the component tree. If you add <h:form>
or <h:subview>
around it, you can the that the same prefix is added to the value you assigned for id.
We are done with id attribute. Now, let’s use the rendered attribute. This attribute can
be used with any Java Server Faces Component, because it is inherited from the UIComponent class, the top
level of the Java Server Faces Component hierarchy. The rendered attribute itself is not passed through to the
HTML code as a tag attribute, but, if it has been set to false, the tag with all of its children will
not be rendered at all.
It is pretty easy to add a rendered attribute. Just add it into the ticker.tld and all is set.
<attribute>
<name>rendered</name>
</attribute>
Add rendered="false" to the <d:ticker> tag, run the application and see what happens. The
browser should show the empty page. When you assign the true value, the page will show the
box with a greeting again.
This is a good time to show why <f:verbatim> is important for this construction. Remove
<f:verbatim> around the Hello JSF Component text, write rendered="false" and run the
application. You can see that the box disappears, but the greeting text is still there. Looking at
the resulting code, you can realize that the <div> tag is stripped out.
Tutorial
