The ValueChangeListener tag registers a ValueChangeListener instance on the component associated with the enclosing tag. The ValueChangeListener interface should be implemented by classes that you want to register with components that publish value change events.

Any component that receives user input, such as one of the HTML select or text input components, can publish value change events. A component fires a value change event when its input changes, but only if the new input is validated successfully.

You can register several ValueChangeListeners with a component and they will be invoked in the order that they are registered. An alternative to this tag is to use a method-binding expression pointing at a value change listener method of a backing bean on the component tag itself.

Notice in the example below the use of the JavaScript onchange() event to trigger form submission when the list selection changes. Without this JavaScript event, the user must manually submit the form to invoke the ValueChangeListener.

Example:

<h:selectOneMenu id="optionMenu" value="#{optionBean.selectedOption}" onchange="submit()">
  <f:selectItems value="#{optionBean.optionList}" />
  <f:valueChangeListener type="com.mycompany.MyValueChangeListenerImpl" />
</h:selectOneMenu>

HTML Output

<select name="form:optionMenu" size="1" onchange="submit()">
  <option value="1">Option 1</option>
  <option value="2">Option 2</option>
  <option value="3">Option 3</option>
</select>