Hello,

If I place a (sortable) rich:scrollableDataTable inside a a4j:outputPanel component clicking on a column header (to change the grid sorting) makes the grid display abnormally.

My scrollableDataTable is placed inside a rich:modalPanel witch is openned by clicking a row in a rich:extendedDataTable component.

Code snippet:

<rich:modalPanel id="editPanel"  autosized="true">
        <f:facet name="header">
            <h:outputText value="#{resources['billing.payments.title']}" />
        </f:facet>
        <h:form>
            <rich:messages style="color:red;"></rich:messages>
            <table width="100%">
            <tr>
            <td>
                <a4j:outputPanel ajaxRendered="true">
                        <rich:scrollableDataTable id="paymentsGrid" width="545px" height="150px" sortMode="single"
                                                  value="#{ShowInvoicesAction.currentArTransaction.payments}"
                                                  var="py" rows="6" rowKeyVar="rkv" selectionMode="none">
                                    <rich:column id="pyDescription" width="130" sortExpression="#{py.ARTransactionType.factoryDescription}" sortable="true">
                                    <f:facet name="header">
                                        <h:outputText value="#{resources['column.invoice.payments']}" />
                                    </f:facet>
                                    <h:outputText value="#{py.ARTransactionType.factoryDescription}"/>
                                </rich:column>
                                <rich:column id="pyDate" width="75" sortExpression="#{py.artransactionDate}" sortable="true">
                                    <f:facet name="header">
                                        <h:outputText value="#{resources['column.invoice.date']}" />
                                    </f:facet>
                                    <h:outputText converter="dateFomatConverter" value="#{py.artransactionDate}"/>
                                </rich:column>
                                  ...
                        </rich:scrollableDataTable>
                </a4j:outputPanel>   
            </td>
            </tr>
            </table>
        </h:form>
    </rich:modalPanel>

If I remove a4j:outputPanel component the grid behaves correctly but in this case the grid is not re-populated correctly.

This is how my scrollableDataTable looks when modal panel is first open:

and this is how it looks after I click on "Date" column header:

Firebug shows the following error message:

PS: I noticed there is a similar bug: https://jira.jboss.org/browse/RF-1451 marked as solved for 3.2.0 version. I'm using 3.3.3.Final release.

Please let me know if there is a valid work-around for this or if this can be solved in a patch for 3.3.3 version.

Regards,

Alin