4 Replies Latest reply on Jun 9, 2008 9:02 AM by ozgur bilir

    Datatable with datascroller is rerendered everytime I open a

    ozgur bilir Newbie

      Hi,

      I have a page with paginating from database. (just becouse there is too much data, I have to get limited count of row everytime)
      Every time I open a context menu and call an action from by bean and show a rerendered modal panel (for the clicked row), program opens a connection and gets table data again.
      It also happens when I close the model panel.

      I`m not making any updates on the modal panel, so that the datatable doesn`t have to be rerendered everytime.

      How can I solve this problem?

        • 2. Re: Datatable with datascroller is rerendered everytime I op
          ozgur bilir Newbie

          It didn`t for unfortunately :(

          by the way here`s my code

          <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
          <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
          <%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
          <%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
          <f:view>
           <%@include file="/header.jspf"%>
           <a4j:loadScript
           src="resource:///org/richfaces/renderkit/html/scripts/scriptaculous/scriptaculous.js" />
           <a4j:loadScript
           src="resource:///org/richfaces/renderkit/html/scripts/scriptaculous/effects.js" />
          
           <script>
           Effect.Transitions.Elastic = function(pos) {
           return -1*Math.pow(4,-2*pos) * Math.sin((pos*3-1)*(3*Math.PI)/2) + 1;
           };
           function hideResultPanel() {
           new Effect.BlindUp($('resultsPanel'), {duration:10.0});
           }
           function showResultPanel() {
           new Effect.BlindDown($('resultsPanel'),{duration:1.0,transition:Effect.Transitions.Elastic});
           }
           </script>
           <style>
          .valignTopAlignCenter {
           vertical-align: top;
           align: center;
           valign: top;
          }
          
          .cur {
           cursor: pointer;
          }
          
          .top {
           vertical-align: top;
           align: center;
          }
          </style>
          
           <a4j:form>
           <a4j:region renderRegionOnly="true">
           <rich:contextMenu attached="false" id="menu" submitMode="ajax"
           hideDelay="0">
           <rich:menuItem ajaxSingle="true" reRender="panel"
           onclick="javascript:Richfaces.showModalPanel('panelLoading')"
           onbeforedomupdate="javascript:Richfaces.hideModalPanel('panelLoading')"
           oncomplete="javascript:Richfaces.showModalPanel('panel')"
           actionListener="#{mainBean.atpFaresBean.setTableRowsFromMemoryAction}"
           action="#{mainBean.atpFaresBean.generateRulesAndFootnotes}">
           Show Rules And Footnotes
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextTar_no}"
           name="tar_no" value="{tar_no}" />
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextCxr_cd}"
           name="cxr_cd" value="{cxr_cd}" />
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextOrg_city}"
           name="org_city" value="{org_city}" />
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextDest_city}"
           name="dest_city" value="{dest_city}" />
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextFare_class}"
           name="fare_class" value="{fare_class}" />
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextEff_date}"
           name="eff_date" value="{eff_date}" />
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextRule_no}"
           name="rule_no" value="{rule_no}" />
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextRtg_no}"
           name="rtg_no" value="{rtg_no}" />
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextOw_rt}"
           name="ow_rt" value="{ow_rt}" />
           <a4j:actionparam
           assignTo="#{mainBean.atpFaresBean.context.contextFtnt}"
           name="ftnt" value="{ftnt}" />
           </rich:menuItem>
           </rich:contextMenu>
          
           <rich:modalPanel id="panel" width="600" height="750">
           <f:facet name="header">
           <h:panelGroup>
           <h:outputText value="Rules And Footnotes"></h:outputText>
           </h:panelGroup>
           </f:facet>
           <f:facet name="controls">
           <h:panelGroup>
           <a4j:commandLink ajaxSingle="true" style="border:0;"
           immediate="true" bypassUpdates="true"
           onclick="javascript:Richfaces.hideModalPanel('panel')"
           actionListener="#{mainBean.atpFaresBean.setTableRowsFromDbAction}">
           <h:graphicImage value="/images/modal/close.png" style="border:0;" />
           </a4j:commandLink>
           </h:panelGroup>
           </f:facet>
          
           <rich:tabPanel switchType="client" selectedTab="rulesTab">
           <rich:tab name="rulesTab" label="Rules">
           <h:inputTextarea
           value="#{mainBean.atpFaresBean.context.textRulesStr}"
           style="width:550px;height:650px;" readonly="true" />
           </rich:tab>
           <rich:tab label="Footnotes">
           <h:inputTextarea
           value="#{mainBean.atpFaresBean.context.textFtntsStr}"
           style="width:550px;height:650px;" readonly="true" />
           </rich:tab>
           </rich:tabPanel>
           </rich:modalPanel>
          
           <rich:modalPanel id="panelLoading" style="align:center;"
           autosized="true">
           <f:facet name="header">
           <h:panelGroup>
           <h:outputText value="Loading..."></h:outputText>
           </h:panelGroup>
           </f:facet>
           <f:facet name="controls">
           <h:panelGroup>
           <a4j:commandLink ajaxSingle="true" style="border:0;"
           immediate="true" bypassUpdates="true"
           onclick="javascript:Richfaces.hideModalPanel('panelLoading')"
           actionListener="#{mainBean.atpFaresBean.setTableRowsFromDbAction}">
           <h:graphicImage value="/images/modal/close.png" style="border:0;" />
           </a4j:commandLink>
           </h:panelGroup>
           </f:facet>
           <h:panelGrid style="align:center;">
           <h:graphicImage url="/images/ajax-loader.gif" style="border:0;" />
           </h:panelGrid>
           </rich:modalPanel>
          
           </a4j:region>
           </a4j:form>
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
           <h:panelGrid width="1000">
           <%@include file="/menu.jspf"%>
           <rich:panel header="PARAMETERS" style="padding:0">
           <a4j:form>
           <h:panelGrid columns="6">
           <h:panelGrid columns="2">
           <h:outputText>Tariff</h:outputText>
           <h:selectOneMenu value="#{mainBean.atpFaresBean.tariff}">
           <f:selectItems value="#{mainBean.atpFaresBean.tariffs}" />
           <a4j:support event="onchange" reRender="resultsPanel"
           ajaxSingle="true"
           action="#{mainBean.atpFaresBean.disableResultPanel}" />
           </h:selectOneMenu>
           <h:outputText>Carrier</h:outputText>
           <h:selectOneMenu value="#{mainBean.atpFaresBean.carrier}">
           <f:selectItems value="#{mainBean.atpFaresBean.carriers}" />
           <a4j:support event="onchange" reRender="resultsPanel"
           ajaxSingle="true"
           action="#{mainBean.atpFaresBean.disableResultPanel}" />
           </h:selectOneMenu>
           </h:panelGrid>
          
           <h:panelGrid columns="2">
           <h:outputText>O-City</h:outputText>
           <a4j:outputPanel id="ocities">
           <h:selectOneMenu value="#{mainBean.atpFaresBean.orgCity}">
           <f:selectItems value="#{mainBean.atpFaresBean.orgCities}" />
           <a4j:support event="onchange" reRender="resultsPanel"
           ajaxSingle="true"
           action="#{mainBean.atpFaresBean.disableResultPanel}" />
           </h:selectOneMenu>
           </a4j:outputPanel>
           <h:outputText>O-Country</h:outputText>
           <h:selectOneMenu value="#{mainBean.atpFaresBean.orgCountry}">
           <a4j:support event="onchange" reRender="ocities,resultsPanel"
           ajaxSingle="true"
           actionListener="#{mainBean.atpFaresBean.disableResultPanelAction}"
           action="#{mainBean.atpFaresBean.generateOrgCities}" />
           <f:selectItems value="#{mainBean.atpFaresBean.orgCountries}" />
           </h:selectOneMenu>
           </h:panelGrid>
          
           <h:panelGrid columns="1">
           <h:selectOneRadio value="#{mainBean.atpFaresBean.orgCityCountry}"
           layout="pageDirection">
           <a4j:support event="onchange" reRender="resultsPanel"
           ajaxSingle="true"
           action="#{mainBean.atpFaresBean.disableResultPanel}" />
           <a4j:support event="onclick" reRender="resultsPanel"
           ajaxSingle="true"
           action="#{mainBean.atpFaresBean.disableResultPanel}" />
           <f:selectItem itemValue="city" itemLabel="" />
           <f:selectItem itemValue="country" itemLabel="" />
           </h:selectOneRadio>
           </h:panelGrid>
          
           <h:panelGrid columns="2">
           <h:outputText>D-City</h:outputText>
           <a4j:outputPanel id="dcities">
           <h:selectOneMenu value="#{mainBean.atpFaresBean.destCity}">
           <f:selectItems value="#{mainBean.atpFaresBean.destCities}" />
           <a4j:support event="onchange" reRender="resultsPanel"
           ajaxSingle="true"
           action="#{mainBean.atpFaresBean.disableResultPanel}" />
           </h:selectOneMenu>
           </a4j:outputPanel>
           <h:outputText>D-Country</h:outputText>
           <h:selectOneMenu value="#{mainBean.atpFaresBean.destCountry}">
           <a4j:support event="onchange" reRender="dcities,resultsPanel"
           actionListener="#{mainBean.atpFaresBean.disableResultPanelAction}"
           action="#{mainBean.atpFaresBean.generateDestCities}"
           ajaxSingle="true" />
           <f:selectItems value="#{mainBean.atpFaresBean.destCountries}" />
           </h:selectOneMenu>
           </h:panelGrid>
          
          
          
          
           <h:panelGrid columns="1">
           <h:selectOneRadio value="#{mainBean.atpFaresBean.destCityCountry}"
           layout="pageDirection">
           <a4j:support event="onchange" reRender="resultsPanel"
           ajaxSingle="true"
           action="#{mainBean.atpFaresBean.disableResultPanel}" />
           <a4j:support event="onclick" reRender="resultsPanel"
           ajaxSingle="true"
           action="#{mainBean.atpFaresBean.disableResultPanel}" />
           <f:selectItem itemValue="city" itemLabel="" />
           <f:selectItem itemValue="country" itemLabel="" />
           </h:selectOneRadio>
           </h:panelGrid>
          
           <h:panelGrid columns="1">
           <a4j:commandButton value="RUN"
           action="#{mainBean.atpFaresBean.generateFaresList}"
           onclick="javascript:Richfaces.showModalPanel('panelLoading')"
           oncomplete="javascript:Richfaces.hideModalPanel('panelLoading')"
           onbeforedomupdate="javascript:Richfaces.hideModalPanel('panelLoading')"
           reRender="resultsPanel">
           </a4j:commandButton>
           <f:verbatim> </f:verbatim>
           </h:panelGrid>
           </h:panelGrid>
           </a4j:form>
           </rich:panel>
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
           <a4j:region renderRegionOnly="true">
           <rich:panel header="FARES" id="resultsPanel" style="padding:0">
           <h:form>
           <h:panelGrid style="height:420px;" columns="1"
           columnClasses="top,top">
           <rich:dataTable id="mytable" style="valignTopAlignCenter"
           value="#{mainBean.atpFaresBean.tableModel}"
           onRowMouseOver="this.style.backgroundColor='#F1F1F1'"
           onRowMouseOut="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'"
           var="atp" binding="#{mainBean.atpFaresBean.table}" rows="15">
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Tariff" />
           </f:facet>
           <h:outputText value="#{atp.tar_no}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Carrier" />
           </f:facet>
           <h:outputText value="#{atp.cxr_cd}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Org City" />
           </f:facet>
           <h:outputText value="#{atp.org_city}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Org Ctry" />
           </f:facet>
           <h:outputText value="#{atp.org_ctry}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Dest City" />
           </f:facet>
           <h:outputText value="#{atp.dest_city}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Dest Ctry" />
           </f:facet>
           <h:outputText value="#{atp.dest_ctry}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Fare Class" />
           </f:facet>
           <h:outputText value="#{atp.fare_class}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Rule" />
           </f:facet>
           <h:outputText value="#{atp.rule_no}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Rtg" />
           </f:facet>
           <h:outputText value="#{atp.rtg_no}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="OW-RT" />
           </f:facet>
           <h:outputText value="#{atp.ow_rt}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Eff.Date" />
           </f:facet>
           <h:outputText value="#{atp.eff_date}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Disc.Date" />
           </f:facet>
           <h:outputText value="#{atp.disc_date}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Ftnt" />
           </f:facet>
           <h:outputText value="#{atp.ftnt}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Global" />
           </f:facet>
           <h:outputText value="#{atp.global}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="MPM" />
           </f:facet>
           <h:outputText value="#{atp.mpm}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Ld.Date" />
           </f:facet>
           <h:outputText value="#{atp.load_date}" />
           </rich:column>
          
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Chg.Date" />
           </f:facet>
           <h:outputText value="#{atp.change_date}" />
           </rich:column>
          
          
           <rich:componentControl event="onRowClick" for="menu"
           operation="show" disableDefault="true">
           <f:param value="#{atp.tar_no}" name="tar_no" />
           <f:param value="#{atp.cxr_cd}" name="cxr_cd" />
           <f:param value="#{atp.org_city}" name="org_city" />
           <f:param value="#{atp.dest_city}" name="dest_city" />
           <f:param value="#{atp.fare_class}" name="fare_class" />
           <f:param value="#{atp.eff_date}" name="eff_date" />
           <f:param value="#{atp.rule_no}" name="rule_no" />
           <f:param value="#{atp.rtg_no}" name="rtg_no" />
           <f:param value="#{atp.ow_rt}" name="ow_rt" />
           <f:param value="#{atp.ftnt}" name="ftnt" />
           </rich:componentControl>
          
           <f:facet name="footer">
           <h:outputText
           value="Displaying #{mainBean.atpFaresBean.table.first + 1} - #{mainBean.atpFaresBean.table.first + mainBean.atpFaresBean.table.rows} of #{mainBean.atpFaresBean.table.rowCount} results." />
           </f:facet>
          
           </rich:dataTable>
           </h:panelGrid>
          
          
           <rich:datascroller id="paginator" maxPages="27" for="mytable"
           fastControls="auto" fastStep="0" ajaxSingle="false" align="center"
           boundaryControls="auto" reRender="errorMessages"
           stepControls="auto" immediate="true"
           onclick="javascript:Richfaces.showModalPanel('panelLoading')"
           oncomplete="javascript:Richfaces.hideModalPanel('panelLoading')"
           onbeforedomupdate="javascript:Richfaces.hideModalPanel('panelLoading')"
           actionListener="#{mainBean.atpFaresBean.setTableRowsFromDbAction}"
           action="#{mainBean.atpFaresBean.setTableRowsFromDb}"
           binding="#{mainBean.atpFaresBean.dataScroller}">
           </rich:datascroller>
           </h:form>
           <h:messages id="errorMessages" />
           </rich:panel>
           </a4j:region>
          
          
          
           </h:panelGrid>
           <%@include file="/footer.jspf"%>
          </f:view>
          


          • 3. Re: Datatable with datascroller is rerendered everytime I op
            Ilya Shaikovsky Master

            b.t.w. at first you have one mistake - form should be inside the MP and not around the panel if there is action components inside ;)

            • 4. Re: Datatable with datascroller is rerendered everytime I op
              ozgur bilir Newbie

              Thx.

              I removed my panel somewhere else out of the form.
              But becouse I used the renderRegionOnly I cannot rerender.
              So I took it back.

              I have to remove the renderRegionOnly to do that.

              Off I`m very new to jsf and richfaces, I have tons of troubles :)