8 Replies Latest reply on Jun 10, 2010 10:22 AM by krikor paol

    Page flipping

    krikor paol Newbie

      I am working on datatables.

       

      http://docs.jboss.org/richfaces/latest_3_3_X/en/devguide/html/rich_dataTable.html#d0e14684

       

      I have a datatable which has 100 values.But I want just 10 of it to show up on the page, and to have  alink for user to flip pages for to view data's from  11 - 20 , 21 - 30 and so on..

       

       

      anyone has idea?         

        • 2. Re: Page flipping
          krikor paol Newbie
          <!doctype html public "-//w3c//dtd html 4.0 transitional//en">
          <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
          <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
          <!-- RichFaces tag library declaration -->
          <%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
          <%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>

           

           

          <html>

           

                <head>
              <style type="text/css">

           


              </style>
                      <title>RichFaces Greeter</title>

           

                </head>

           

             

           

                      <f:view>
          <h:form id="zForm">
          <a4j:keepAlive beanName="events" ajaxOnly="true"/>
                  <rich:datascroller align="left" for="appTable"  reRender="sc2" id="sc1" />
                  <rich:spacer height="30" />
          <rich:dataTable value="#{events.listOfEvents}"
          var="record" id="appTable" rows="#{common.rowNum}"
          onRowMouseOver="this.style.backgroundColor='#B5F3FB'" width="100%"
          onRowMouseOut="this.style.backgroundColor='#{a4jSkin.rowBackgroundColor}'">

           

           

                           <rich:column>
                               <f:facet name="header">
                              <h:outputText value=""/>
                              </f:facet>
                              <h:selectBooleanCheckbox  value="#{record.deleteRow}"   id="tableSelectOne1" ></h:selectBooleanCheckbox>
                             
                              </rich:column>
                      
                               <rich:column>
                               <f:facet name="header">
                              <h:outputText value="Name"/>
                              </f:facet>
                              <h:outputText value="#{record.name}" />
                             
                              </rich:column>
                             
                                <rich:column>
                               <f:facet name="header">
                              <h:outputText value="Status"/>
                              </f:facet>
                              <h:outputText value="#{record.stat}" />
                              </rich:column>
                              <rich:column>
                               <f:facet name="header">
                              <h:outputText value="Notification Date"/>
                              </f:facet>
                              <h:outputText value="#{record.dateToUse}" />
                              </rich:column>
                                <rich:column>
                               <f:facet name="header">
                              <h:outputText value="Event Date"/>
                              </f:facet>
                              <h:outputText value="#{record.occuredOnDate}" />
                              </rich:column>
                                     <rich:column>
                               <f:facet name="header">
                              <h:outputText value=""/>
                              </f:facet>
                              <a4j:commandLink id="edit" value="edit"  ></a4j:commandLink>
                              </rich:column>
                 
                          </rich:dataTable>
             <rich:datascroller align="left" for="appTable"    id="sc2" reRender="sc1" />

           

                            
              
                 
          </h:form>
          </f:view>
          </html>

           

           

          I have done that, however its not working.Once I flip the page, it doesnt flip.Same data shows up.

          Any guess what the problem could be?         

          • 3. Re: Page flipping
            krikor paol Newbie

            When I am flipping the table is not updating, what could it be?

            • 4. Re: Page flipping
              krikor paol Newbie

              Could it be because my page has 202 pages to flip?

               

              Each page with 10 data. I have around 2200 data ..

               

               

              If yes thats the problem, how to work around it?

              • 5. Re: Page flipping
                krikor paol Newbie

                I have added this

                <rich:datascroller page="#{bean.page}" />

                 

                It still doesnt work.but when i refresh the page, it opens the data on say page 6...

                • 6. Re: Page flipping
                  Ilya Shaikovsky Master

                  if you just using value binding to such a huge list - major slowdowns could be at server side.. You could implement your model properly for real pagged data loading http://livedemo.exadel.com/richfaces-demo/richfaces/dataTable.jsf?tab=dataModel&cid=1625964 and http://livedemo.exadel.com/richfaces-demo/richfaces/dataTable.jsf?tab=modifiableDataModel&cid=1625973.

                   

                  Full Sources for demo there  jboss.org/richfaces/demos

                  • 7. Re: Page flipping
                    krikor paol Newbie

                    It also works when I do this

                     

                     

                    <!doctype html public "-//w3c//dtd html 4.0 transitional//en">
                    <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
                    <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
                    <!-- RichFaces tag library declaration -->
                    <%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
                    <%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>



                    <html>

                          <head>
                                <title>Global Events</title>

                          </head>
                       
                    <body>
                    <f:view>

                         
                    <h:form id="zForm">
                    <rich:datascroller onclick="return true" align="left" for="appTable"  page="#{events.pageFlip}" />
                    <rich:dataTable    rows="#{common.rowNum}"   value="#{events.listOfEvents}"
                    var="record" id="appTable"
                    onRowMouseOver="this.style.backgroundColor='#B5F3FB'" width="100%"
                    onRowMouseOut="this.style.backgroundColor='#{a4jSkin.rowBackgroundColor}'">


                                <f:facet name="header">
                                    <rich:columnGroup>
                                     <h:column>
                                            <h:outputText styleClass="headerText"  />
                                        </h:column>
                                        <h:column>
                                            <h:outputText styleClass="headerText" value="Name" />
                                        </h:column>
                                        <h:column>
                                            <h:outputText styleClass="headerText" value="Status" />
                                        </h:column>
                                        <h:column>
                                            <h:outputText styleClass="headerText" value="Notification Date" />
                                        </h:column>
                                        <h:column>
                                            <h:outputText styleClass="headerText" value="Event Date" />
                                        </h:column>
                                         <h:column>
                                            <h:outputText styleClass="headerText"  />
                                        </h:column>
                                    </rich:columnGroup>
                                </f:facet>

                              
                                <h:column>
                                 <h:selectBooleanCheckbox  value="#{record.deleteRow}"   id="tableSelectOne1" ></h:selectBooleanCheckbox>
                                </h:column>


                                
                                        <h:column>
                                        <h:outputText value="#{record.name}" />                  
                                         </h:column>
                                       
                                                  <h:column>
                                        <h:outputText value="#{record.stat}" />                  
                                         </h:column>
                                                   <h:column>
                                        <h:outputText value="#{record.dateToUse}" />                  
                                         </h:column>
                                                     <h:column>
                                        <h:outputText value="#{record.occuredOnDate}" />                  
                                         </h:column>
                                                        <h:column>
                            
                                        <h:commandLink id="edit" value="edit"  ></h:commandLink>
                                        </h:column>
                           
                                    </rich:dataTable>
                             
                      
                           
                    </h:form>
                    </f:view>
                    </body>
                    </html>

                     

                     

                    Very simple, once he clicks on datascroller i click on commandlink which changes the page.

                     

                    So is there a solution for the initial problem?I dont like to solve it with workarounds like this              

                    • 8. Re: Page flipping
                      krikor paol Newbie

                      I'' check those links and work on them.thankyou