JSF Basic Attributes

Attribute	Description	Used with
id	Component Identifier	All tags
binding	Binding this component with backing bean property	All tags
rendered	Value for this attribute should be boolean. If value is false, component will not be rendered.	All tags
styleClass	CSS class name	All tags
value	Component’s value. It can be value expression.	Input, Output, Command Tags
valueChangeListener	Expression to a backing bean method that responds to value changes	Input tags
converter	Class name of a converter	Input, Output tags
validator	Class name of a validator	Input tags
required	Value for this attribute should be boolean. If value is true, value must be entered to this input field.	Input tags
converterMesssage	A custom message to be displayed when conversion fails.	Input tags
validatorMessage	A custom message to be displayed when validation fails.	Input tags
requiredMessage	A custom message to be displayed when required input is missing	Input tags

Now we will study id, binding, value attribute, remaining attributes are studied in subsequent chapters.

id

If we do not specify the id attribute explicitly, id is generated by the JSF implementation for all generated HTML elements. The versatile id attribute lets you do the following:

Access JSF components from other JSF tags

The id attribute lets page authors reference a component from another tag. For example, an error message for a component can be displayed like this:

<h:inputText id="name" .../>

<h:message for="name"/>

You can also use component

Obtain component references in Java code

For example, you could access the name component in a listener like this:

UIComponent component = event.getComponent().findComponent("name");

The preceding call to findComponent has a requirement: The component that generated the event and the name component must be in the same form (or data table).

Access HTML elements with JavaScripts

Id specified in HTML element can be used by JavaScript code like in document.getElementById("elementID");

binding

Using binding attribute we can bind the UI component to the ManagedBean property. ManagedBean property which is bound should be of type UIComponent. Using getters and setters access this UI component.

Example:

<h:outputText binding="#{BeanName.PropertyName}" .../>

In ManagedBean we will be having code like below

private UIComponent var = new UIOutput();

public UIComponent getVra() {

return statePrompt;

}

public void setVar(UIComponent var) {

this.var = var;

}

The variable var in ManagedBean and text field UI components are now bound, making changes anywhere will affect both.

value

Inputs, outputs, commands, and data tables all can have value attribute.

<h:outputText value="William"/>

<h:commandButton value="Login" />

Most of the time you will use a value expression, for example:

<h:outputText value="#{ManagedBean.PropertyName}"/>

In this case the value of this UI component is bound with the value of some property in ManagedBean , making changes anywhere will affect both. Using getters and setters methods the value is accessed in ManagedBean.

All Chapters