+ Start a Discussion
MayTheForceBeWithYouMayTheForceBeWithYou 

Dynamic reRender Help

I have been beating my head against the wall trying to get a dynamic reRender to work on my visualforce page. Essentially my VFPage embeds via iFrames a separate VFpage that displays a table. I want the user to be able to select from a picklist the number of tables he/she wishes to be displayed (1-5). Upon changing the # of tables the VFpage should be refreshed to display the corresponding number of iFrames. This is all working properly so far.

 

Here is my issue-the VFpage embedded via iFrames contains dynamic content as well and I would like this information to be preserved should another table be added to the page; thus, I want the onchange event on my table # picklist to cause a dynamic reRender that will only do a partial page refresh of the iFrames formerly not displayed while leaving the visible iFrames untouched. Hopefully this makes sense but I will post my VFPage and Controller extension as well for you to look at; thanks so much!

 

VFPage:

 

<apex:page standardController="Quantitativo__c" extensions="MultQuantAnal">
<div align="center">
<h1 style="font-size:16pt"><apex:outputText value="Quantitative Analysis"></apex:outputText></h1>
</div>
<apex:form >
<div align="center">
<br/>
<apex:outputText >Tabels:&nbsp;</apex:outputText>
<apex:selectList id="chooseTables" value="{!numTables}" size="1">
          <apex:selectOption itemValue="1" itemLabel="1"/>
          <apex:selectOption itemValue="2" itemLabel="2"/>
          <apex:selectOption itemValue="3" itemLabel="3"/>
          <apex:selectOption itemValue="4" itemLabel="4"/>
          <apex:selectOption itemValue="5" itemLabel="5"/>
<apex:actionSupport event="onchange" reRender="{!PanelRef}"/>
</apex:selectList>
</div>
<br/>
<apex:outputPanel id="one">
<apex:iframe height="250" rendered="{!numTables>=1}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="two">
<apex:iframe height="250" rendered="{!numTables>=2}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="three">
<apex:iframe height="250" rendered="{!numTables>=3}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="four">
<apex:iframe height="250" rendered="{!numTables>=4}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="five">
<apex:iframe height="250" rendered="{!numTables==5}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
</apex:form>
</apex:page>

 

Controller Extension:

 

public class MultQuantAnal {

    public Integer numTables{get;set;}
    
    public void setnumTables(String numVar) {
        this.numTables = Integer.valueOf(numVar);
    }

    public MultQuantAnal(ApexPages.StandardController controller) {
        this.numTables=1;
    }

    public String getPanelRef(){
        if (numTables==1){
            return 'one,two,three,four,five';
        }
        else if (numTables==2){
            return 'two,three,four,five';
        }
        else if (numTables==3){
            return 'three,four,five';
        }
        else if (numTables==4){
            return 'four,five';
        }
        else {
            return 'five';
        }
    }
}

 

Sam27Sam27

welll you are ought to beat your head against the wall man.......reRender take the 'id' and not the methods, for methods there is 'action' attribute

<apex:page standardController="Quantitativo__c" extensions="MultQuantAnal">
<div align="center">
<h1 style="font-size:16pt"><apex:outputText value="Quantitative Analysis"></apex:outputText></h1>
</div>
<apex:form >
<div align="center">
<br/>
<apex:outputText >Tabels:&nbsp;</apex:outputText>
<apex:selectList id="chooseTables" value="{!numTables}" size="1">
          <apex:selectOption itemValue="1" itemLabel="1"/>
          <apex:selectOption itemValue="2" itemLabel="2"/>
          <apex:selectOption itemValue="3" itemLabel="3"/>
          <apex:selectOption itemValue="4" itemLabel="4"/>
          <apex:selectOption itemValue="5" itemLabel="5"/>
<apex:actionSupport event="onchange" action="{!PanelRef}" reRender="one,two,three,four,five"/>
</apex:selectList>
</div>
<br/>
<apex:outputPanel id="one">
<apex:iframe height="250" rendered="{!numTables>=1}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="two">
<apex:iframe height="250" rendered="{!numTables>=2}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="three">
<apex:iframe height="250" rendered="{!numTables>=3}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="four">
<apex:iframe height="250" rendered="{!numTables>=4}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="five">
<apex:iframe height="250" rendered="{!numTables==5}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
</apex:form>
</apex:page>

 or you can simply put all the one,two,three in one outputpanel, and provide the id of that outputpanelin the reRender attribute........................

 

Hope that helps

 

Sam

MayTheForceBeWithYouMayTheForceBeWithYou

Sam-I appreciate the response but unfortunately the issue is the value of the reRender attribute is dynamic; I may want to reRender panels 2-5, 3-5, etc. I had limited success using a method from my controller that returns a string to the reRender attribute, but it is still not working properly-any ideas? Thanks!

Sam27Sam27

You have already provided the logic....the problem is synchronization

 

Okay check this one.....

<apex:page standardController="Quantitativo__c" extensions="MultQuantAnal">
<div align="center">
<h1 style="font-size:16pt"><apex:outputText value="Quantitative Analysis"></apex:outputText></h1>
</div>
<apex:form >
<div align="center">
<br/>
<apex:outputText >Tabels:&nbsp;</apex:outputText>
<apex:selectList id="chooseTables" value="{!numTables}" size="1">
          <apex:selectOption itemValue="1" itemLabel="1"/>
          <apex:selectOption itemValue="2" itemLabel="2"/>
          <apex:selectOption itemValue="3" itemLabel="3"/>
          <apex:selectOption itemValue="4" itemLabel="4"/>
          <apex:selectOption itemValue="5" itemLabel="5"/>
<apex:actionSupport event="onchange" action="{!PanelRef}" reRender="framePanel"/>
</apex:selectList>
</div>
<br/>
<apex:outputPanel id="framePanel">
<apex:outputPanel id="one">
<apex:iframe height="250" rendered="{!numTables>=1}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="two">
<apex:iframe height="250" rendered="{!numTables>=2}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="three">
<apex:iframe height="250" rendered="{!numTables>=3}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="four">
<apex:iframe height="250" rendered="{!numTables>=4}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
<apex:outputPanel id="five">
<apex:iframe height="250" rendered="{!numTables==5}" frameborder="false" src="/apex/QuantAnal"/>
</apex:outputPanel>
</apex:outputPanel>
</apex:form>
</apex:page>

 

Hope that helps

 

Sam

 

MayTheForceBeWithYouMayTheForceBeWithYou

Thanks Sam, but unfortunately that reRenders all the tables since they all exist within the framePanel outputPanel.