5

I am trying to track which tab is clicked and displayed the content of clicked tab only. Since we have 8 tabs and each one has at least a form so I just want to render the tab it was just clicked; otherwise it generates bunch view state which slows down ajax call.

Visualforce:

<apex:tabPanel switchType="server" selectedTab="{!selectedTab}" value="{!selectedTab}"  id="theTabPanel" >  
    <apex:tab label="Details" name="tabDetails" id="tabDetails" styleClass="subTab" onClick="setActiveTab('taskdetails')">
       <apex:pageBlock > 
          <apex:include pageName="taskDetailView"/>
       </apex:pageBlock>
    </apex:tab>

    <apex:tab label="photos" name="tabPhotos" id="tabPhotos" styleClass="subTab" onClick="setActiveTab('photos')">                             
       <apex:pageBlock > 
          <apex:include pageName="photos"/>
       </apex:pageBlock>                
    </apex:tab>
</apex:tabPanel>

<apex:actionFunction name='setActiveTab' action='{!setActiveTab}' >
    <apex:param id='tabname' name='tabname' value=''>
</apex:actionFunction>

Controller:

public with sharing class MyControllerExtension{
        public String currentTabName;
        public String selectedTab {

            get {
                return currentTabName;                     
            }
        }
        public String setActiveTab(){
            String para = ApexPages.CurrentPage().getParameters().get('tabname');        
            System.debug('current tab is ' + para);
        }
    }

This is what my tabpanel looks like. I tried set up actionFunction and call the function on apex:tab I wasn't able to send the tab name successfully

2
  • 1
    Could you post the Javascript and the Apex Class corresponding to the VF page? Thanks.
    – subodhbahl
    Sep 10, 2013 at 22:29
  • Thanks! I added my controller and action function and onclick event for javascript Sep 10, 2013 at 22:57

1 Answer 1

5

Your action function should look like the following:

<apex:actionFunction action="{!setActiveTab}" name="setActiveTab">
     <apex:param id="tabname" assignTo="{!var}" value="" />
</apex:actionFunction>

Controller:

Private String var = 'photos';
public void setVar(String n) {
    var = n;
}

public String getVar() {
    return var;
}

Hope this helps. This should work!

3
  • I added reRender on actionFunction and change setActiveTab to setVar to make it work. Thanks Sep 11, 2013 at 10:14
  • Yep that would have worked too, but the approach I described is a very generic approach. I am happy it worked!
    – subodhbahl
    Sep 11, 2013 at 16:04
  • If you have view state in your page then better to use @RemoteAction - force201.wordpress.com/2012/06/01/….
    – Keith C
    Oct 4, 2013 at 14:16

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .