How to identify selected tab in SelectedTabChangeListener?

Question

I want perform specific action when user selects one of the tabs.

final TabSheet tabs = new TabSheet();
tabs.addTab(a, "a");

The following code always outputs null:

tabs.addTab(b, "b");
System.out.println(a.getCaption());
tabs.addSelectedTabChangeListener(event -> {
    System.out.println(event.getTabSheet().getSelectedTab().getCaption());
    System.out.println(event.getTabSheet().getSelectedTab().getId());
});

I can't immagine why `getSelectedTab()` would return the tab content... but, how about using `if (tabs.getTab(tabs.getSelectedTab()) == a) { ... }`? — Morfic, Oct 24 '17 at 11:10
Apologies, `a` in your example is the tab content, so the actual code should be similar to `Tab aTab = tabs.addTab(a, "a"); if (tabs.getTab(tabs.getSelectedTab()) == aTab) { ... }`. Or, if you don't need to actually do anything with your tab, just check whether the content of the selected tab is the one you want `a == tabs.getSelectedTab()`. I'll add a reply to make it clearer — Morfic, Oct 25 '17 at 08:23

score 2 · Accepted Answer · answered Oct 25 '17 at 08:49

I have yet to understand the reasoning behind getSelectedTab() returning the tab content instead of the actual tab instance, but you have at least the following 2 options:

if you want to do something to the actual tab instance, you can get it using the selected tab content
if you don't care about the tab and you only need to know that a certain tab was selected, you can check the selected tab content against the expected content

Code:

import com.vaadin.ui.Button;
import com.vaadin.ui.CheckBox;
import com.vaadin.ui.TabSheet;
import com.vaadin.ui.VerticalLayout;

public class TabSelectionComponent extends VerticalLayout {
    public TabSelectionComponent() {
        // tab contents
        Button aButton = new Button("A");
        Button bButton = new Button("B");

        // tabs and tab sheet
        TabSheet tabs = new TabSheet();
        TabSheet.Tab aTab = tabs.addTab(aButton, "A");
        TabSheet.Tab bTab = tabs.addTab(bButton, "B");

        // checkboxes for selection visualization
        CheckBox byTabInstance = new CheckBox("Check by tab instance");
        byTabInstance.setEnabled(false);
        CheckBox byTabContent = new CheckBox("Check by tab content");
        byTabContent.setEnabled(false);

        tabs.addSelectedTabChangeListener(event -> {
            // the selected tab matches the expected one
            byTabInstance.setValue(tabs.getTab(tabs.getSelectedTab()) == aTab);

            // the selected content matches the expected one 
            byTabContent.setValue(tabs.getSelectedTab() == aButton);
        });

        // add components to the UI
        addComponents(tabs, byTabContent, byTabInstance);
    }
}

Result:

score 0 · Answer 2 · answered Oct 24 '17 at 10:46

The following code works but it doesn't seem to be particularly nice:

final Tab b = tabs.addTab(b, "b");
System.out.println(a.getCaption());
tabs.addSelectedTabChangeListener(event -> {
    final String connectorId = event.getTabSheet().getSelectedTab().getConnectorId();
    final String bTabConnectorId = logoutTab.getComponent().getConnectorId();
    if(connectorId.equals(bTabConnectorId)) {
        System.out.println("selected"); // prints if selected tab == b
    }
});

pirho · Answer 3 · 2017-10-24T15:24:36.557

This is ok: event.getTabSheet().getSelectedTab().getId()

You just need to explicitly set the id for the components yourself after creating them: a.setId("id_a"); b.setId("id_b")); otherwise getId() returns null whic is the default.

Might be good idea also to take a look at setData() if in need to use something else than plain string.

Sets the data object, that can be used for any application specific data. The component does not use or modify this data.

How to identify selected tab in SelectedTabChangeListener?

3 Answers3