togglepanel
Hi,
I tried togglepanel and it works well.
But I see a weird thing. In each panel, I have the text pulled up from a database table and displayed in a scrollable datatable. For eg; Panel 1 display the records from Table 1 and Panel 2 displays the records from Table 2, etc. It works well as it pulls the records from the correct tables and displays them. The thing I noticed is that, when I click on panel 1, it extracts the data from table 1, table2, etc even though it only needs the records from table 1 to be displayed in panel 1. Next, when I click panel 2, it again extracts the data from table 1, table2, etc even though it only needs records from table 2. This makes the performance too slow. The switchType="ajax" is setup in the program.
Please let me know what is to be done so that the unneccsary extracts can be prevented.
Thanks
Aish
The code is given for your reference.(This is a sample and hence the ids have been like a junk id.)
===========================
<%@ 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"%>
function numeClick()
{
var buttonObject= window.parent.document.getElementById("myForm:_id40:cButton1");
buttonObject.click();
}
function UpdateTdsCommonTransClick()
{
var buttonObject= window.parent.document.getElementById("myForm:_id40:cButton2");
buttonObject.click();
}
<h:panelGrid style="width:730px" columns="6"
id="nume_pGrid">
<h:outputText value="Summary Table " style="width:640px"
styleClass="topicStyle" id="nume_oText" />
<h:outputText value="From Date : " styleClass="contentStyle"
id="nume_oText3" />
<rich:calendar value="#{process.summaryUpdateFromDate}"
popup="true" datePattern="#{ReusableUtils.pattern}"
enableManualInput="true" showApplyButton="false" style="width:150px"
disabled='#{ReusableUtils.selected == true}'
id="nume_summaryUpdateFromDate">
<a4j:support ajaxSingle="true"
onsubmit="CompareDates('myForm:_id40:nume_summaryUpdateFromDateInputDate','myForm:_id40:nume_summaryUpdateToDateInputDate')"
event="onchanged" id="nume_support"
reRender="nume_oPanel, nume_aPanel1" />
</rich:calendar>
<h:outputText value="To Date : " styleClass="contentStyle"
id="nume_oText2" />
<rich:calendar value="#{process.summaryUpdateToDate}"
popup="true" datePattern="#{ReusableUtils.pattern}"
enableManualInput="true" showApplyButton="false" style="width:100px"
disabled='#{ReusableUtils.selected == true}'
id="nume_summaryUpdateToDate">
<a4j:support ajaxSingle="true"
onsubmit="CompareDates('myForm:_id40:nume_summaryUpdateFromDateInputDate','myForm:_id40:nume_summaryUpdateToDateInputDate')"
event="onchanged" id="nume_support1"
reRender="nume_oPanel,nume_aPanel1" />
</rich:calendar>
<a4j:status id="commonstatus">
<f:facet name="start" id="nume_facet">
<h:graphicImage value="images/ajax_process.gif" title="Searching..."
id="nume_gImage" />
</f:facet>
</a4j:status>
</h:panelGrid>
<rich:spacer height="5px" id="nume_spacer" />
<a4j:outputPanel id="nume_oPanel">
<rich:scrollableDataTable rowKeyVar="rkv" height="245px" first="0"
width="720px" id="nume_sTable"
value="#{process.displaySummaryTblDetails}" var="SummaryTbl"
sortMode="single"
selection="#{process.scrollableUpdateSummaryDataTableSelection}"
binding="#{process.sdnume}"
focus="nume_sTable"
onRowClick="numeClick()" columnClasses="columnclasses">
<rich:column width="70" id="nume_column3">
<f:facet name="header" id="nume_facet4">
<h:outputText value="File Id" id="nume_oText10" />
</f:facet>
<h:outputText value="#{SummaryTbl.file}"
id="nume_oText11" />
</rich:column>
</rich:scrollableDataTable>
</a4j:outputPanel>
<rich:spacer height="5px" id="nume_spacer1" />
<a4j:commandButton id="cButton1" value="."
reRender="nume_aPanel1"
style="width:1px;height:1px;this.style.display='none'"
action="#{process.extractSummaryDetails}" status="commonstatus" />
<rich:spacer height="5px" id="nume_spacer3" />
<a4j:outputPanel id="nume_aPanel1">
<rich:togglePanel id="panel1" switchType="ajax" initialState="blank"
stateOrder="blank, table1, table2, table3">
<f:facet name="blank">
<rich:panel>
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Selected File Id : " style="font-weight: bold;"
id="nume_oText401" />
<h:outputText value="#{process.selectedRecfile}"
id="nume_oText511" style="font-weight: bold;"/>
<rich:toggleControl id="toggleControl_canon1" for="panel1"
value="table1 " switchToState="table1">
</rich:toggleControl>
<h:outputText value=" " />
<rich:toggleControl id="toggleControl_nikon1" for="panel1"
value=" table2 " switchToState="table2">
</rich:toggleControl>
<h:outputText value=" " />
<rich:toggleControl id="toggleControl_canon11" for="panel1"
value=" table3 " switchToState="table3">
</rich:toggleControl>
<h:outputText value=" " />
</h:panelGroup>
</f:facet>
<h:outputText value="This is a blank tab" />
</rich:panel>
</f:facet>
<f:facet name="table1">
<rich:panel>
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Selected File Id : " style="font-weight: bold;"
id="nume_oText402" />
<h:outputText value="#{process.selectedRecfile}"
id="nume_oText512" style="font-weight: bold;"/>
<rich:toggleControl id="toggleControl_canon2" for="panel1"
value=" blank " switchToState="blank" />
<h:outputText value=" " />
<rich:toggleControl id="toggleControl_nikon2" for="panel1"
value=" table2 " switchToState="table2" />
<h:outputText value=" " />
<rich:toggleControl id="toggleControl_canon21" for="panel1"
value=" table3 " switchToState="table3">
</rich:toggleControl>
<h:outputText value=" " />
</h:panelGroup>
</f:facet>
<rich:scrollableDataTable rowKeyVar="rkv" height="125px" first="0"
width="735px" id="u10"
value="#{process.displayTdsCommonsTransDetails}"
selection="#{process.scrollableTdsCommonsTransTableSelection}"
binding="#{process.sdTdsCommonsTransTable}"
var="tdsCommonTrans" sortMode="single" onRowClick="UpdateTdsCommonTransClick()"
columnClasses="columnclasses">
<rich:column width="70" id="a">
<rich:column width="70" id="a3">
<f:facet name="header" id="a31">
<h:outputText value="rowno" id="a311" />
</f:facet>
<h:outputText value="#{tdsCommonTrans.rowno}"
id="aa3" />
</rich:column>
</rich:scrollableDataTable>
</rich:panel>
</f:facet>
<f:facet name="table2">
<rich:panel>
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Selected File Id : " style="font-weight: bold;"
id="nume_oText403" />
<h:outputText value="#{process.selectedRecfile}"
id="nume_oText513" style="font-weight: bold;"/>
<rich:toggleControl id="toggleControl_canon3" for="panel1"
value=" blank " switchToState="blank" />
<h:outputText value=" " />
<rich:toggleControl id="toggleControl_nikon3" for="panel1"
value=" table1 " switchToState="table1" />
<h:outputText value=" " />
<rich:toggleControl id="toggleControl_canon31" for="panel1"
value=" table3 " switchToState="table3">
</rich:toggleControl>
<h:outputText value=" " />
</h:panelGroup>
</f:facet>
<rich:scrollableDataTable rowKeyVar="rkv" height="125px" first="0"
width="735px" id="u2"
value="#{process.displayTdsExtfndTransDetails}"
var="tdsExtfndTrans" sortMode="single"
columnClasses="columnclasses">
<rich:column width="70" id="a31">
<f:facet name="header" id="a31">
<h:outputText value="rowno" id="a3111" />
</f:facet>
<h:outputText value="#{tdsExtfndTrans.rowno}"
id="aa31" />
</rich:column>
</rich:scrollableDataTable>
</rich:panel>
</f:facet>
<f:facet name="table3">
<rich:panel>
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Selected File Id : " style="font-weight: bold;"
id="nume_oText404" />
<h:outputText value="#{process.selectedRecfile}"
id="nume_oText514" style="font-weight: bold;"/>
<rich:toggleControl id="toggleControl_canon4" for="panel1"
value=" blank " switchToState="blank" />
<h:outputText value=" " />
<rich:toggleControl id="toggleControl_canon421" for="panel1"
value=" table1 " switchToState="table1 ">
</rich:toggleControl>
<h:outputText value=" " />
<rich:toggleControl id="toggleControl_nikon42" for="panel1"
value=" table2 " switchToState="table2" />
<h:outputText value=" " />
</h:panelGroup>
</f:facet>
<rich:scrollableDataTable rowKeyVar="rkv" height="125px" first="0"
width="735px" id="u4"
value="#{process.displayStiStgJrlLineDetail}"
var="sdsCommonTrans" sortMode="single"
columnClasses="columnclasses">
<rich:column width="70" id="a39">
<f:facet name="header" id="a31">
<h:outputText value="rowno" id="a3119" />
</f:facet>
<h:outputText value="#{sdsCommonTrans.rowno}"
id="aa399" />
</rich:column>
<rich:column width="70" id="a49">
<f:facet name="header" id="a419">
<h:outputText value="code" id="a4119" />
</f:facet>
<h:outputText value="#{sdsCommonTrans.code}" id="aa49" />
</rich:column>
</rich:scrollableDataTable>
</rich:panel>
</f:facet>
</rich:togglePanel>
</a4j:outputPanel>
<a4j:commandButton id="cButton2" value="."
reRender="nume_aPanel1"
style="width:1px;height:1px;this.style.display='none'"
action="#{process.extractRecordDetails}" status="commonstatus" />