Need OnClientTabSelected to Fire even when already selected

[jlj30]

Hi,

I have a tabstrip with 2 levels of tabs - the main/root tabs and child tabs.

All tabs are dynamically built at runtime using client side code and web service calls.

See the attached screenshot for an example.

When the user clicks on the main tab, an associated diagram is displayed.

When the user clicks on a child tab, a sub-diagram is displayed.

This all works fine.

However, if a child tab has been selected (causing a sub-diagram to be displayed) and the user wants to go back to the main diagram, if they click on the main tab at this point no event is raised (since the main tab is already selected).

Is there anyway to force an event (preferably OnClientTabSelected) when the user clicks on an already selected main tab?

My thanks in advance for any advice.

Jim

[Veselin Tsvetanov]

Hello Jim,

You could use the following implementation of the OnClientSelectedTab event handler in order to clear the RadTabStrip selected sub-item when you click on top level items:

function onClientTabSelected(sender, args) {
    var currentTab = args.get_tab();
    var currentTabParent = currentTab.get_parent();
    var selectedSubTab = currentTab.get_selectedTab();
    if (selectedSubTab) {
        selectedSubTab.set_selected(false);
        currentTab.set_selected(true);
    }
}

Note that the above will allow you to clear the selected sub-tab when navigating to another top-level tab. In order to have clickable top-level tab, after you have already selected a sub-tab of it, you will have to force the top-level to be closed. To do that, you could add to the above function the flowing:

if (!selectedSubTab && currentTabParent != sender) {
    currentTabParent.set_selected(false);
}

However, this will force hide of the sub-item tabs, so you will have to click again the top-level tab and then click on the desired sub-tab if you want to go to another sub-tab of the same top-level tab.

I hope that the above helps you.

Regards,
Veselin Tsvetanov
Telerik