rich:dataScroller does not refresh rich:dataTable in JSF

Question

I have a rich:dataTable and a rich:dataScroller. When I click on the datascroller, my dataTable does not refresh automatically to show the correct page. If, however, I press the refresh button the dataTable shows the correct page.

What am I doing wrong?

Here is my code:

<rich:dataTable id="applicantsTable"
binding="#{applicantListManBean.applicantsDataTable}"
value="#{applicantListManBean.applicantsList}" var="applicant"
rows="10" width="650">

<h:column>
    <f:facet name="header">
        <h:outputText value="Name" />
    </f:facet>
    <h:outputText value="#{applicant.name}" />
</h:column>

<h:column>
    <f:facet name="header">
        <h:outputText value="Email" />
    </f:facet>
    <h:outputText value="#{applicant.email}" />
</h:column>

<h:column>

    <f:facet name="header">
        <h:outputText value="Action" />
    </f:facet>

    <h:commandLink action="#{applicantListManBean.showApplicantProducts}"
        rendered="true">
        <h:graphicImage value="/images/icons/view.png" width="15" height="15"
            alt="view" />
        <f:setPropertyActionListener
            target="#{applicantListManBean.tempApplicant}" value="#{applicant}" />
    </h:commandLink>

    <h:commandLink action="#{applicantListManBean.deleteApplicant}"
        rendered="true">
        <h:graphicImage value="/images/icons/delete.png" width="15"
            height="15" alt="view" />
        <f:setPropertyActionListener
            target="#{applicantListManBean.tempApplicant}" value="#{applicant}" />
    </h:commandLink>

</h:column>
</rich:dataTable>

<rich:datascroller id="applicantsScroller" for="applicantsTable"
reRender="sc1" maxPages="7" page="#{applicantListManBean.scrollerPage}" />

UPDATE: Javascript error attached:

1: http://imgur.com/132fL.png

Solution 1

The problem is the h:commandLink. It somehow creates problems for the rich:datatable. Use a4j:commandLink or s:link (if you use Jboss Seam) instead.

Solution 2

Remove reRender="sc1". You have copy-pasted this from the RichFaces demo, but you have removed the "sc1" component, so perhaps a javascript error occurs that prevents the table from refreshing.

Also make sure you have your dataTable and datascroller surrounded by <h:form>..</h:form> (both in one form)

Solution 3

You may want to consider using t:saveState tag or putting the handler in session scope. The reason this is probably happening is because you have your handler in request scope and since the commandLink is another request, it cannot find the original handler instance to post back to. By simply having this saveState in here, mine started working.

Just a thought.

Comments

[Bozho]

see your firefox javascript console for any js errors and give them here

[Markos Fragkakis]

I have them surrounded by both <f:view> and <h:form>, in this order.

[Bozho]

try removing parts of the code (some columns, the binding attribute, etc), and see when it will start working (i.e. it will stop giving the js error)

[Kryten]

Welcome to SO! For visitors who might come by looking for the answer to this question, could you expand on this a bit and explain why one should try this?