+ Start a Discussion
Scott.MScott.M 

Dynamically Set Active Tab in apex:tabPanel

Hi,

I have a situation where I need to dynamically set the default tab in a tab panel. I have a parameter in my controller that I'm trying to use but for some reason the default tab isn't being set. If I hard code the name of the tab it works but once I try to use a visual force parameter the default tab doesn't get set properly. Here's sample code that illustrates the problem:

Code:
public class TabTest {


 public String ActiveTab {get; set;} 
 
 
 public TabTest() {
  this.ActiveTab = 'Tab2'; 
 }


}

Code:
<apex:page controller="TabTest">
 <apex:tabPanel switchType="client" selectedTab="{!ActiveTab}" id="slipTabPanel">
    <apex:tab label="Tab 1" name="tab1" id="tab1">
      Tab1
    </apex:tab>
    <apex:tab label="Tab 2" name="tab2" id="tab2">
      Tab2 
    </apex:tab>
    <apex:tab label="Tab 3" name="tab3" id="tab3">
      Tab3
    </apex:tab>
 </apex:tabPanel>
</apex:page>

 If I hard code to selectedTab="tab2" then it works fine but if I try to use a controller parameter it doesn't work. Any ideas what I might be doing wrong?
 

jwetzlerjwetzler
This is a known issue that we already have a bug for.
Scott.MScott.M
Thanks Jill!

Here's hoping for the fix in the next release :)
DS777DS777
Set the value parameter of the tabPanel
Mark YoungMark Young

Hi Scott,

http://community.salesforce.com/sforce/board/message?board.id=Visualforce&thread.id=3610&page=2

This is a temporary javascript workaround if you require one.
 
Mark
JavajJavaj

Just change this line

 

<apex:tabPanel switchType="Ajax" value="{!ActiveTab}" id="slipTabPanel">

 

Walter@AdicioWalter@Adicio

Thank you , that helped me.

SujitMandalSujitMandal

switchType="client" worked for me... :)

vanessenvanessen

switchType="client" didn't work for me... but "Ajax" yes.....:-)

S Kumar.ax1063S Kumar.ax1063

Hi Alex,

I am also getting stuck in this situation.
Code..
<apex:page controller="TabTest">
<apex:tabPanel switchType="client" selectedTab="{!ActiveTab}" id="slipTabPanel">
<apex:tab label="Tab 1" name="tab1" id="tab1">
Tab1
</apex:tab>
<apex:tab label="Tab 2" name="tab2" id="tab2">
Tab2
</apex:tab>
<apex:tab label="Tab 3" name="tab3" id="tab3">
Tab3
</apex:tab>
</apex:tabPanel>
</apex:page>

In controller I am getting tab name based on different navigation ,but on VF page tab is not switching.

It wolud be great if you can help me in this.How your code is working?

Mitesh SuraMitesh Sura

Developers and ISVs please vote for this idea: https://success.salesforce.com/ideaView?id=08730000000kteEAAQ

HariPHariP
Hi,

I have similar problem. I tried both switchTypes (client and ajax). Still not working.

Here is my sample code:
        <apex:tabPanel switchType="ajax" selectedTab="{!selectedTab}" id="AccountTabPanel" immediate="true"
            tabClass="activeTab" inactiveTabClass="inactiveTab" activeTabClass="activeTab" headerSpacing="15px" height="100px">
            <apex:tab label="One" name="tab1" id="tabOne">content for tab one</apex:tab>
            <apex:tab label="Two" name="tab2" id="tabTwo">
                content for tab two
            </apex:tab>
        </apex:tabPanel>

Has anyone get it working? What is wrong in my code? Please help.

Thanks

 
HariPHariP
Changing the tabPanel attribute from selectedTab="{!selectedTab}" to value="{!selectedTab}" worked perfectly.

Reference: http://www.salesforce.com/docs/developer/pages/Content/pages_compref_tabPanel.htm

 
Amit Chaudhary 8Amit Chaudhary 8

Please check below link. That will help you :-
http://amitsalesforce.blogspot.in/2014/11/dynamic-tab-in-salesforce-css-and.html
Deja BondDeja Bond
Hi, all this worked for me https://developer.salesforce.com/docs/component-library/bundle/lightning:tabset/documentation