Dynamic tabs in visual force pages

Hi All,

Last 2 days i am scratching my head to find a solution for generating dynamic tabs in a visual force page from controller class.

Here is the code , this is not optimized i wrote it just for learning.

VF Page:

<apex:page sidebar="false" controller="TopOpportunityController" >
<apex:form >
<apex:commandButton value="New" action="{!updateNumberOfTabs}" reRender="DynamicTabs"/>
<apex:pageBlock id="DynamicTabs" title="Dynamic Tab Demo"  >
<apex:pageblockSection >
<apex:pageBlockSectionItem >
<apex:dynamicComponent componentValue="{!tabs}"/>
</apex:pageBlockSectionItem>
</apex:pageblockSection>
</apex:pageBlock>
</apex:form>
</apex:page>

And the controller for the above code is :

public with sharing class TopOpportunityController {
public string str{get;set;}
public class caseWrapper
{
    public String Description{get;set;}
    public String Status{get;set;}
}
public caseWrapper c{get;set;}
List<caseWrapper> caseWrp{get;set;}

public static Component.Apex.tabPanel p= new Component.Apex.tabPanel();
public Integer numberofTabs;
    public TopOpportunityController() 
    {
        
        //p = new Component.Apex.tabPanel();
        c = new caseWrapper();
        numberofTabs =1;
        caseWrp = new List<caseWrapper>();
        /*ADDING ONE TAB BY DEFAULT*/
         p.selectedTab='tab'+numberofTabs;         
         Component.Apex.tab tab1 = new Component.Apex.tab();
         tab1.switchType = 'client';
         tab1.name= 'tab'+1;
         tab1.label= 1+'-Tab';
         tab1.id = 'tab'+1;
         Component.Apex.CommandButton command = new Component.Apex.CommandButton();
         command.value='Save';
         command.expressions.action='{!save}';
         tab1.childComponents.add(command);
         Component.Apex.outputText f = new Component.Apex.outputText();
         f.value = 'Description';
         tab1.childComponents.add(f);
         Component.Apex.InputText t = new Component.Apex.InputText();
         t.expressions.value ='{!c.status}' ;
         tab1.childComponents.add(t);
         p.childComponents.add(tab1);      
         caseWrp.add(c);
    }

public void updateNumberOfTabs()
{
    numberofTabs++;
    caseWrapper c = new caseWrapper();
    //p.selectedTab='tab';         
    Component.Apex.tab tab1 = new Component.Apex.tab();
    tab1.switchType = 'client';
    tab1.name= 'tab'+numberofTabs;
    tab1.label= numberofTabs+'-Tab';
    tab1.id = 'tab'+numberofTabs;
    Component.Apex.CommandButton command = new Component.Apex.CommandButton();
    command.value='Save';
    command.expressions.action='{!save}';
    tab1.childComponents.add(command);
    Component.Apex.outputText f = new Component.Apex.outputText();
    f.value = 'Description';
    tab1.childComponents.add(f);
    Component.Apex.InputText t = new Component.Apex.InputText();
    t.expressions.value ='{!c.status}' ;
    tab1.childComponents.add(t);
    System.debug('------------------>'+p.childComponents);
    p.childComponents.add(tab1);
    System.debug('>>>>>>>>>>>>>>>>>>'+p.childComponents);       
    caseWrp.add(c);
}

public Component.Apex.tabPanel gettabs()
{
    
    return p;
}

public void save(){ 
System.debug('-------------'+caseWrp);
}

}

let me expalin a bit here

I am able to display the first tab in the visual force page and when i click on new button the controller should add another tab to the exsting page but not happening. instead it overwriting the existing tab.

The variable p in the controller is declared as static and when i update the variable with another tab, the old values is getting wiped out from it.(i think thats how static variable works, please let me know if i am wrong). Also i tried making it as a transient variable but updating the variable in the update method in the controller says "Attempt to de reference a null object".

Please help me out here. And teach me if my concept of transient and static variables are wrong.

I just wanted to display a new tab when i click on new button, also the field value i am entering in the tab fields i should get inn the controller wrapper class.

Thanks in advance

George Thomas

September 2, 2013
·
Answer
·
Like
0
·
Follow
0

sfdcfox
Static variables are transient. Transient variables, in turn, are not serialized as part of the view state; this means that the values aren't refreshed when the page calls a postback, so the original data is lost. Instead, you'll have to use "set" and "get" methods to properly render the data and receive the updates to the tabpanel. You can't serialize components, either. You probably already found this out by an error message, and thus went with a static variable to try and resolve the error.

September 2, 2013
·
Like
0
·
Dislike
0

georg
Thanks for explaining transient and static keywords.

But still i am not sure how can i display the dymanic tab panel in visual force pages. Like i am not able to use Component.Apex.tabPanel with out static or transient keyword, getting serialization exception. If i am using transient or static keyword the previous values are getting destroyed. Is there any other way to escape from these issues.

Thanks,
George

September 2, 2013
·
Like
0
·
Dislike
0

sfdcfox
public with sharing class tab { public void addTab() { names.add(newTabName); } string[] names = new string[0]; public String newTabName { get; set; } public Component.Apex.TabPanel getTabPanel() { Component.Apex.TabPanel panel = new Component.Apex.TabPanel(); panel.switchType = 'client'; for(integer idx = 0; idx < names.size(); idx++) { Component.Apex.Tab tab = new Component.Apex.Tab(); tab.id = 'tab'+string.valueof(idx); tab.label = names[idx]; panel.childComponents.add(tab); } return panel; } }

<apex:page controller="tab"> <apex:form > <apex:pageBlock > <apex:pageBlockButtons location="bottom"> <apex:inputText value="{!newTabName}"/> <apex:commandButton value="Add Tab" action="{!addTab}"/> </apex:pageBlockButtons> <apex:dynamicComponent componentValue="{!tabPanel}"/> </apex:pageBlock> </apex:form> </apex:page>

But, I haven't gotten to the part where I get the data back into the controller. This is more meant as an example.