RichFaces dataTable and table control inside modalPanel

[katsu]

hi guys,

i have problem when facing with rich:modalPanel and rich:dataTable. the datatable is placed in modalPanel, displaying data from Seam component, EmployeeList. the problem is, the table have large enough data to be displayed at a whole. so, i need page control inside modalPanel and call EmployeeList.setMaxResults with something smaller than 25 (default) to make the dataTable fit with modalPanel size. here's the snippet

Employee.xhtml:

<script type="text/javascript">
/*use Seam remoting*/
function showModal(modal)
{
        var el = Seam.Component.getInstance("employeeList");
        el.setMaxResults(5);
        Richfaces.showModalPanel(modal);
}
</script>

<a:commandLink value="Select employe..." 
        onclick="javascript:showModal('empModal')"
        reRender="empTable" />
<rich:modalPanel id="empModal" width....>
        <rich:dataTable id="empTable" value="#{employeeList.resultList}"
        ...>
        .
        .
        </rich:dataTable>
</rich:modalPanel>

surprisingly none of above works :-( 
the dataTable don't refresh at all (it still display 25 row data) and i even don't have any idea about table control inside modalPanel. any help or advice will be appreciated. thanks so much and sory for poor English

Note: JavaScript Remoting is OK and work appropriately

[clerum]

Have you considered using a DataScroller  ?

[freakwave10]

We are using exactly the same, here is the modal panel

<rich:modalPanel id="searchfmno" autosized="true" width="450">
                    <f:facet name="header">
                         <h:outputText value="Book for Someone else" />
                    </f:facet>
                    <f:facet name="controls">
                         <h:panelGroup>
                              <h:graphicImage value="../img/thin_close_view.gif"
                                   styleClass="hidelink" id="hidelink" />
                              <rich:componentControl for="searchfmno" attachTo="hidelink"
                                   operation="hide" event="onclick" />
                         </h:panelGroup>
                    </f:facet>

                    <h:form>
                         <rich:dataTable value="#{BasisPersonVList.resultList}"
                              var="_BasisPersonV" id="table" rows="20">
                              <f:facet name="header">
                                   <rich:columnGroup>

                                        <rich:column breakBefore="true">
                                             <h:outputText value="FMNO" />
                                        </rich:column>
                                        <rich:column>
                                             <h:outputText value="First Name" />
                                        </rich:column>
                                        <rich:column>
                                             <h:outputText value="Last Name" />
                                        </rich:column>
                                        <rich:column>
                                             <h:outputText value="Action" />
                                        </rich:column>
                                   </rich:columnGroup>
                              </f:facet>

                              <rich:column>
                                   <f:facet name="header">
                                        <h:inputText value="#{BasisPersonVList.BasisPersonV.fmno}"
                                             id="inputFmno">
                                             <a4j:support event="onkeyup" reRender="table , ds2"
                                                  ignoreDupResponses="true" requestDelay="700"
                                                  oncomplete="setCaretToEnd(event);" />
                                        </h:inputText>
                                   </f:facet>
                                   <h:outputText value="#{_BasisPersonV.fmno}" />
                              </rich:column>
                              <rich:column>
                                   <f:facet name="header">
                                        <h:inputText
                                             value="#{BasisPersonVList.BasisPersonV.firstName}"
                                             id="inputFirstName">
                                             <a4j:support event="onkeyup" reRender="table , ds2"
                                                  ignoreDupResponses="true" requestDelay="700"
                                                  oncomplete="setCaretToEnd(event);" />
                                        </h:inputText>
                                   </f:facet>
                                   <h:outputText value="#{_BasisPersonV.firstName}" />
                              </rich:column>
                              <rich:column>
                                   <f:facet name="header">
                                        <h:inputText
                                             value="#{BasisPersonVList.BasisPersonV.lastName}"
                                             id="inputLastName">
                                             <a4j:support event="onkeyup" reRender="table , ds2"
                                                  ignoreDupResponses="true" requestDelay="700"
                                                  oncomplete="setCaretToEnd(event);" />
                                        </h:inputText>
                                   </f:facet>
                                   <h:outputText value="#{_BasisPersonV.lastName}" />
                              </rich:column>

                              <rich:column styleClass="action">
                                   <h:commandButton
                                        action="#{meAccountWizardBean.getSelectedRecord(_BasisPersonV.fmno, _BasisPersonV.internetMailAddress )}"
                                        value="" image="../img/edit.gif" />
                              </rich:column>
                              <f:facet name="footer">
                                   <rich:datascroller id="ds2" renderIfSinglePage="false"></rich:datascroller>
                              </f:facet>
                         </rich:dataTable>
                    </h:form>

               </rich:modalPanel>

Regards,

Wolfgang

[allforjava.allforjava.aol.in]

Hi Wolfgang,

We too faced the same problem using datascroller with resultList. May be the problem is the pagination is performed on the provided list. The next/ previous etc does not invoke the respective result sets. To test, get resultlist with max result to 20 and in datascroller set max row display to 5 or 10 and check it.

We are using the EntityQuery methods for pagination with s:link

<h:panelGrid columns="8">
                        <s:link view="/workLogList.xhtml"
                                rendered="#{workLogList.previousExists}" value="First Page"
                                reRender="ss">
                                <f:param name="firstResult" value="0" />
                        </s:link>
                        <rich:spacer value="30" />

                        <s:link view="/workLogList.xhtml"
                                rendered="#{workLogList.nextFirstResult > workLogList.maxResults ? true : false}"
                                value="Previous Page" reRender="ss">
                                <f:param name="firstResult" value="#{workLogList.previousFirstResult}" />
                        </s:link>
                        <rich:spacer value="30" />


                        <s:link view="/workLogList.xhtml"
                                rendered="#{workLogList.resultCount >= workLogList.nextFirstResult ? true : false}"
                                value="Next Page" reRender="ss">
                                <f:param name="firstResult" value="#{workLogList.nextFirstResult}" />
                        </s:link>
                        <rich:spacer value="30" />

                        <s:link view="/workLogList.xhtml" rendered="#{workLogList.nextExists}"
                                value="Last Page" reRender="ss">
                                <f:param name="firstResult" value="#{workLogList.lastFirstResult}" />
                        </s:link>
                </h:panelGrid>

[katsu]

i gotta half step to solution dudes, i think.

i agree with Prathamesh, except pagination method with page param is unacceptable inside modal panel.
the datascroller works nicely, but still there a bit problem.
it make datatable paginable, without a sense of is there another data behind.
because datatable only display 25 (it depends on what had passed into setMaxResults) row data from getResultList(), the last page of datascroller is 25/(row per page -> <rich:datatable rows=...>).

it's absolutely incorrect if we have data larger than default value (25). i spent a couple hour at https://www.jboss.org/file-access/default/members/jbossrichfaces/freezone/docs/devguide/en/html/datascroller.html to find is there a way for datascroller to refresh the datatable with previousFirstResult, nextFirstResult, lastFirstResult stuffs, but no results

thanks in advance

[katsu]

guys,

finally i find a solution, but it may be not the elegant one.

i ommit the call of setMaxResults in constructor of EmployeeList.java:

.....
// setMaxResults(25);
.....

and move the restrictions back in EmployeeList.page.xml, so the EmployeeList.xhtml can keep the pagination on.

i add the following in EmployeeList.page.xml:

<action execute="#{employeeList.setMaxResults(25)}"/>

so far so good, it works nicely.
but i'm newbie in Seam, so i don't know if this approach have some pitfall. i hope you guys give a comment on my work or share another idea.

regards,

Adam

[pomcompot.pomme_compote-seamframework.yahoo.fr]

You use reRender attribute into s:link but it seems this attribute is not available for s:link. Does it work and you really have a AJAX style rerender or is it an error ?