+ Start a Discussion
georggeorg 

Dynamic tabs in visual force page

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