Selected tab not shown

[Stefania Iszabela Nagy]

Hi,

I have the following code:

<telerikNavigation:RadTabControl Width="150">
    <telerikNavigation:RadTabItem Header="Tab_1" Content="Tab 1 Content"/>
    <telerikNavigation:RadTabItem Header="Tab_2" Content="Tab 2 Content"/>
    <telerikNavigation:RadTabItem Header="Tab_3" Content="Tab 3 Content"/>
    <telerikNavigation:RadTabItem Header="Tab_4" Content="Tab 4 Content" IsSelected="True" />
</telerikNavigation:RadTabControl>

where there is a tab control with four tabs in it, and I want the last one to be selected. The thing is that it selects the last tab, but it is not visible in the header.
In the "howitis.png" file it is the way it works and in "expected.png" is the way I would expect it to be.

Do you have a solution for this?

Thank you.

[Kiril Stanoev]

Hi Stefania,

Thank you for your feedback. Indeed, there is an issue when trying to bring an item into view. We will try to fix this issue by the end of Q1 2010, but I cannot confirm this with 100% certainty. A workaround for this scenario is to use a dispatcher and select the item in the code-behind:

<telerikNavigation:RadTabControl Width="150" Height="150">
    <telerikNavigation:RadTabItem Header="Tab_1" Content="Tab 1 Content" />
    <telerikNavigation:RadTabItem Header="Tab_2" Content="Tab 2 Content" />
    <telerikNavigation:RadTabItem Header="Tab_3" Content="Tab 3 Content" />
    <telerikNavigation:RadTabItem x:Name="tabItemToSelect" Header="Tab_4" Content="Tab 4 Content" />
</telerikNavigation:RadTabControl>

public partial class MainPage : UserControl
{
    public MainPage()
    {
        InitializeComponent();
        Dispatcher.BeginInvoke(() =>
        {
            this.tabItemToSelect.IsSelected = true;
        });
    }
}

Let me know how this works for you. Also, I have added 1000 Telerik points to your account. If you have additional questions or comments, I'd be glad to further assist you.

Best wishes,
Kiril Stanoev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Stefania Iszabela Nagy]

Unfortunatelly this does not work for me.
What I am trying to do is to programatically add tabs when a button is clicked. This works fine until a tab that exceedes the tab control's width is added, in which case the view is moved on the first tab and the added tab which is the selected one is not visible.
So in my page I have a RadTabControl with no tabs in it and a button:

<telerikNavigation:RadTabControl x:Name="tabControl" Width="350">
</telerikNavigation:RadTabControl>
<Button x:Name="addTabTrigger" Click="addTabTrigger_Click"/>

on the button's click event I am adding new tabs to the tab control:

private void addTabTrigger_Click(object sender, RoutedEventArgs e)
{
    RadTabItem tabToAdd = new RadTabItem();
    tabToAdd.Header = "...";
    tabToAdd.Content = "...";
    tabControl.Items.Add(tabToAdd);
    tabToAdd.IsSelected = true;
    //I've also tryed:
    tabControl.ScrollIntoView(tabToAdd);
    //and
    Dispatcher.BeginInvoke(() =>
    {
        tabToAdd.IsSelected = true;
    });
}

So, the tab is added, selected and visible until the tabs widths exceedes the tab control width, in which case the view is set to the first tab.

[Miroslav]

Hello Stefania Iszabela Nagy,

I am sorry for the delayed reply!

In this case, could you try switching the calls like so:

tabToAdd.IsSelected = true;
Dispatcher.BeginInvoke(() =>
{
    tabControl.ScrollIntoView(tabToAdd);

});

BringIntoView requires the delay because at the time of adding the item it has not visually appeared.

Hopefully this will work for you,

Greetings,
Miroslav
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.