Change listener without submitting the form

Question

I've got a list box and I want to catch change in selection in order to fill an other one according to it. I've tried in the following way:

<h:selectOneMenu id="comunitaValle" value="#{struttura.nomeComunitaDiValle}" 
     onchange="submit()" valueChangeListener="#{struttura.getComuniInComunita}">
<f:selectItems value="#{struttura.comunitaValleList}" />
</h:selectOneMenu>

It works fine, but the fact that in this page there are other parameters marked as

required="true"

and when the form is submitted I get my error messages controlling that those field has been set. How can I avoid to submit the entire form to avoid this to happen and still have the correct behaviour on the 2 list boxes?

EDIT:

I've reached a kind of solution (don't know if it is the best one) according to https://stackoverflow.com/a/4802483/2492962 :

<h:selectOneMenu id="comunitaValle" value="#{struttura.nomeComunitaDiValle}" 
      valueChangeListener="#{struttura.getComuniInComunita}" immediate="true">
<a4j:support event="onchange" reRender="cap"/>
<f:selectItems value="#{struttura.comunitaValleList}" />
</h:selectOneMenu>

Can it be fine? JBoss shows a warning message:

INFO  [lifecycle] WARNING: FacesMessage(s) have been enqueued, but may not have been displayed.

but the refresh seems fine.

Answer 1

I've reached a kind of solution (don't know if it is the best one) according to https://stackoverflow.com/a/4802483/2492962 :

<h:selectOneMenu id="comunitaValle" value="#{struttura.nomeComunitaDiValle}" 
      valueChangeListener="#{struttura.getComuniInComunita}" immediate="true">
<a4j:support event="onchange" reRender="cap"/>
<f:selectItems value="#{struttura.comunitaValleList}" />
</h:selectOneMenu>

<h:selectOneMenu id="cap" value="#{struttura.cap}"  >
<f:selectItems value="#{struttura.comuneIstatCapList}" />
</h:selectOneMenu>

Answer 2

Say your JSF looks like this:

<h:selectOneMenu id="comunitaValle" value="#{struttura.nomeComunitaDiValle}">
   <f:ajax listener="#{struttura.getComuniInComunita}" 
           execute="@this" render="myListBox" />   
   <f:selectItems value="#{struttura.comunitaValleList}" />
</h:selectOneMenu>

<h:selectManyListbox id="myListBox" value="#{struttura.backingValueList}">
   <f:selectItems value="#{struttura.listBoxValues}" var="val" 
                  itemLabel="#{val.name}" />
</h:selectManyListbox>

Your backing bean then needs a method getComuniInComunita that accepts a javax.faces.event.AjaxBehaviorEvent parameter (see the reference for more information).

The execute attribute will cause JSF to only update/validate the select menu before invoking the listener method. Since your select menu only controls the list box(es), you can give a specific component id to update after the listener method finishes.

Answer 3

Here's a solution for JSF1.2, using Richfaces3.3 <a4j:support>:

<a4j:region>
  <h:selectOneMenu id="comunitaValle" value="#{struttura.nomeComunitaDiValle}">
     <a4j:support event="onchange" action="#{struttura.getComuniInComunita}" 
             ajaxSingle="true" reRender="myListBox" limitToList="true" />   
     <f:selectItems value="#{struttura.comunitaValleList}" />
  </h:selectOneMenu>

  <h:selectManyListbox id="myListBox" value="#{struttura.backingValueList}">
     <f:selectItems value="#{struttura.listBoxValues}" var="val" 
                    itemLabel="#{val.name}" />
  </h:selectManyListbox>
</a4j:region>

This is the closest I've come to replicating JSF-2. The <a4j:region> enables us to restrict processing to a subset of the page (works like the execute attribute in JSF-2).

In addition, you may find the Richfaces architecture overview to be helpful.