How can i make the valueChangeListener works for all item under foreach?

Question

Hi,
My jspx file have the following content:
<af:forEach items="#{pageFlowScope.directiveStep.paraItems}"
                                                   var="item">
                                          <af:panelLabelAndMessage label="#{item.name}"
                                                                   id="plam2"
                                                                   for="soc1">
                                             <af:panelGroupLayout id="pgl2"
                                                                  layout="horizontal">
                                                <af:selectOneChoice id="soc1"
                                                                    value="#{item.howValue}"
                                                                    required="true"
                                                                    valueChangeListener="#{pageFlowScope.directiveStep.howToSetDirectivePropValueChange}"
                                                                    autoSubmit="true">
                                                   <f:selectItem value="Set Value}"
                                                                  id="si1"/>
                                                  <f:selectItem value="Choose a Value"
                                                                  id="si1"/>
                                                </af:selectOneChoice>
                                                <af:switcher facetName="#{item.selectWay}"
                                                             id="switch1">
                                                   <f:facet name="true">
                                                      <af:selectOneChoice id="soc2"
                                                                          required="true"
                                                                          value="#{item.value}">
                                                         <f:selectItems value="#{pageFlowScope.directiveStep.procVarItems}"
                                                                        id="si2"/>
                                                      </af:selectOneChoice>
                                                   </f:facet>
                                                   <f:facet name="false">
                                                      <af:inputText id="it1"
                                                                    required="true"
                                                                    value="#{item.value}"/>
                                                   </f:facet>
                                                </af:switcher>
                                             </af:panelGroupLayout>
                                          </af:panelLabelAndMessage>
                                       </af:forEach>
The ui is like:
label name     |    selectOneChoice : 'Set Value' or 'Choose a Value'   |        inputText (if it is 'Set Value') / selectOneChoice (if it is 'Choose a Value')
The weird thing is when i click the selectOneChoice of the two or later row, the ValueChangeListener will be invoked, it indeed change the value  of 'selectWay' correctly. But the UI will not update. If later i do the same thing to the first row, all other rows in UI will update corrently.
Any suggestions? Very appreciated for any repiles.
Thanks.

Answer 1

Hi,
on problem I spot is that all your components created by the forEach loop have the same ID value. I suggest you change the ID to e.g. id="soc_#{item.index}" for zhe select one choices. In addition, I don't see where you refresh components after the change
Frank