Ajax call is made but the related fields are updated only after page refresh

I have tried making an ajax call for a selectOneMenu using JSF 2 and primefaces 2.2. The actionListener method is being called. But the columns I specified in the update attribute are not getting updated. When I refersh the page, I could find the updated values. Please help me out in this.

The code I used was

    <h:form id="mainForm" prependId="false">
<p>
<p:tabView>
        <p:tab title="Receipt">

    <p:dataTable id="table1" var="recepit" rowIndexVar="rowIndex"   value="#{ReceiptDetailsBean.iterativeList}" scrollable="true"  height="120px" styleClass="leftTable">

            <p:column style="background-color: #EFF2F9">
                <f:facet name="header">
                    <h:outputText value="SL NO" />
            </f:facet>
                    <h:outputText value="#{rowIndex+1}" />

            </p:column>

            <p:column >
                <f:facet name="header">
                    <h:outputText value="Buss." />
                </f:facet>

                        <h:selectOneMenu id="selectOneCb4" value="#{ReceiptDetailsBean.bussCode}" >
                            <f:selectItem itemLabel="V_BUSS_CODE" itemValue=""/>
                            <f:selectItems value="#{ReceiptDetailsBean.rdetails}" var="model" itemLabel="#{model.buss}" itemValue="#{model.buss}"/>
                             <p:ajax update="table1:#{rowIndex}:receiptCode, table1:#{rowIndex}:referenceType"  actionListener="#{ReceiptDetailsBean.obtainReceiptDatabasedOnBussCode}" event="change"/>  
                        </h:selectOneMenu>

            </p:column>

            <p:column>
                <f:facet name="header">
                    <h:outputText value="Receipt Code" />
                </f开发者_高级运维:facet>
                    <h:inputText value="#{ReceiptDetailsBean.receiptCode}" id="receiptCode" style="font-family: verdana;font-size: 10px;width:80px;height:15px" onkeypress="return showForhotKey(event,'#{rowIndex}');"/>

            </p:column>

            <p:column>
                <f:facet name="header">
                    <h:outputText value="Ref Type" />
                </f:facet>
                    <h:inputText value="#{ReceiptDetailsBean.receiptType}" id="referenceType" style="font-family: verdana;font-size: 10px;width:80px;height:15px"  onkeypress="return showForhotKey(event,'#{rowIndex}');"/>

            </p:column>
    </p:dataTable>  
        </p:tab>

        <p:tab title="Print">

        </p:tab>

---

Try f:ajax instead of p:ajax and re-render the whole form to get closer to the problem source :

<h:selectOneMenu id="selectOneCb4" value="#{ReceiptDetailsBean.bussCode}" >
   <f:selectItem itemLabel="V_BUSS_CODE" itemValue=""/>
   <f:selectItems value="#{ReceiptDetailsBean.rdetails}" var="model" 
                  itemLabel="#{model.buss}" itemValue="#{model.buss}"/>
   <f:ajax render="@form"  
           listener="#{ReceiptDetailsBean.obtainReceiptDatabasedOnBussCode}"/>  
</h:selectOneMenu>

This should work as stated in my answer to your previous question.

---

Partial updates of dataTables and ajax updates of dataTables triggered from a component within the dataTable are not working in the 2.2 version of Primefaces. This is a known bug that may have been resolved in version 3.

One suggestion you can try is to use a single form for each dataTable and only update elements from within that one form.