How to use <a4j:ajax> with <f:selectItems>

Question

I want to write ajax function and pass selected value from select dropdown menu to bean. This is what I have:

<rich:select id="ctpMeasurementUnits"
    value="#{associationBean.selectedMruId}"
    defaultLabel="#{msg['classifier.select']}"
    requiredMessage="#{msg['classifier.measurementUnitRequire']}"
    validatorMessage="#{msg['common.selectIllegalValue']}">
        <f:selectItems
            value="#{measurementUnitsListBean.allMeasurementUnits}"
            var="mru" itemLabel="#{mru.mruName}" itemValue="#{mru.mruId}">
            <a4j:ajax event="change" execute="@this" listener="#{associationBean.onSelectChangeMru(mru)}" />
        </f:selectItems>
    <f:validateRequired />
    <rich:validator />
</rich:select>

However, by using this piece of code I am getting an error:

<a4j:ajax> Unable to attach <a4j:ajax> to non-ClientBehaviorHolder parent

Question: how to use ajax function from f:selectItems dropdown menu?

Answer 1

You have to attach a4j:ajax to rich:select not f:selectItems

<rich:select id="ctpMeasurementUnits"
value="#{associationBean.selectedMruId}"
defaultLabel="#{msg['classifier.select']}"
requiredMessage="#{msg['classifier.measurementUnitRequire']}"
validatorMessage="#{msg['common.selectIllegalValue']}">
    <f:selectItems
        value="#{measurementUnitsListBean.allMeasurementUnits}"
        var="mru" itemLabel="#{mru.mruName}" itemValue="#{mru.mruId}">        
    </f:selectItems>
  <f:validateRequired />
  <a4j:ajax event="change" execute="@this" listener="#{associationBean.onSelectChangeMru(mru)}" />
  <rich:validator />
</rich:select>