Switch from one Tab to another in apex:Tab panel

Here is the sample code using which we can do navigate between tabs present inside apex:tabpanel.

VF Code:

<apex:page controller="TabNavigation">
<!-- Define Tab panel .css styles -->
<style>
.activeTab {background-color: #236FBD; color:white; background-image:none}
.inactiveTab { background-color: lightgrey; color:black; background-image:none}
</style>

<apex:form >
<apex:tabPanel id="theTabPanel" value="{!tabOpt}" tabClass="activeTab" inactiveTabClass="inactiveTab">
<apex:tab label="One" name="Tab1" id="Tab1"><apex:commandButton value="Go to Tab2" action="{!switch}"/></apex:tab>
<apex:tab label="Two" name="Tab2" id="Tab2"><apex:commandButton value="Go to Tab1" action="{!switch}"/></apex:tab>
</apex:tabPanel>
</apex:form>
</apex:page>

Apex Controller:

public class TabNavigation
{
public String tabOpt {get;set;}
public String amount {get;set;}
public Boolean curencyBool {get;set;}
Integer i = 1;
public TabNavigation()

{
tabOpt = 'Tab1';
}
public void switch()
{
i++;
i = (i > 2) ? 1 : i;
tabOpt = 'Tab'+i;
}
}

• Posted in: Salesforce Apex
• Tagged: apex:tab, apex:tabpanel, Dipak Blog, Salesforce, swicth tab in visualforce, tab navigation, Visualforce