This is a migrated thread and some comments may be shown as answers.

SelectedItem lost when Switching tabs

2 Answers 339 Views
TabControl
This is a migrated thread and some comments may be shown as answers.
Derek Ealy
Top achievements
Rank 1
Derek Ealy asked on 05 May 2010, 12:08 AM
Hi

I have a tab control problem in that when there are multiple tabs and the user switches from one to the other, the state of the elements in the TabItem is lost. All of the text box values seem to be fine, but the selectedItem of comboboxes and of a radtreeview seem to be lost. So if I open a tab and pick an item from the tree in the TabItem then switch to another tab, and then switch back to the tabItem with the tree, the tree is now collapsed as if the selectedItem has been lost.

Inside of the debugger when I stop in the tabControl's SelectionChanged event handler I see that the tree's selectedItem value appears to have the right value, but nonetheless the tree is collapsed.

Any suggestions about what might be wrong, or how I can force the tree and comboboxes to show the correct selectedItem once the tabItem they belong to regains focus?

Thanks, Derek

2 Answers, 1 is accepted

Sort by
0
Derek Ealy
Top achievements
Rank 1
answered on 07 May 2010, 12:21 AM
Did I forget to do something that would get a response from the support team?

After 2 days of trying to troubleshoot this problem I've just had to go with a workaround. I'm posting again, hoping someone can clue me in to what might be going on here. Maybe there's just something I don't understand about the way the RadTabControl is working beneath the covers?

After much experimentation, I figured out that every time a new tab is clicked on the SelectedItem properties of my RadComboBoxes and RadTreeViews was being set to null on the RadTabItem controls that were loosing focus. My XAML binds the SelectedItem to properties in my ViewModels that were being set to null at this point. Stopping in the debugger when the bound properties were set to null offered no help because the stack trace would just show [external code]. What's especially perplexing is that there was one RadComboBox that didn't have this problem (never seemed to loose its selectedItem). All of these ItemSources were bound to ObservableCollections, some held strings and others more complex types that I defined.

When the tabItem is loosing focus what is setting those selectedItem properties to null? All of my tabItems were defined in a single ContentTemplate within a Style stored in User.Resources. Everytime an action occurs a new tabItemViewModel is created and added to the observableCollection bound to the RadTabControl.ItemsSource.

My work around has been to notice when the SelectedItem of the TabControl is being changed, then to set a property on its viewModel indicating that it is now disconnected from the view, and will ignore all setters at that point (this is a sucky hack). Here is that function:
        public VTableViewModel CurrentTable 
        { 
            get { return currentTable; } 
            set 
            { 
                if (currentTable == value) 
                    return; 
 
                if (currentTable != null) 
                    currentTable.ViewConnected = false
                currentTable = value
                currentTable.ViewConnected = true
                SelectedTable = currentTable.Table.Header as TableHeader; 
                NotifyPropertyChanged("CurrentTable"); 
            } 
        } 

You'll see that CurrentTable is bound to the TabControl's SelectedItem in the Xaml below. This prevents things from getting set to null when a new tab is clicked on.

I'm including the whole Xaml file, its pretty fairly large (sorry). I've cut out some of the Xaml that doesn't bear on the issue here, its possible some brackets might not match. The controls loosing their selectedItem values are cbxParentTables, and treeColumnsGroups. The cbxDecoratorClasses control doesn't seem to suffer from this problem. The tab control is tbcTables.

I hope someone can respond this time.

Thanks, Derek

<UserControl 
    <UserControl.Resources> 
        <DataTemplate x:Key="ColumnTreeItemTemplate"
            <Grid> 
                <TextBlock Text="{Binding Name}"/> 
            </Grid> 
        </DataTemplate> 
        <DataTemplate x:Key="OtherTablesTemplate"
            <Grid> 
                <TextBlock Text="{Binding Table.OtherTables}"/> 
            </Grid> 
        </DataTemplate> 
        <Style x:Key="ClosableStyle" TargetType="telerikNavigation:RadTabItem"
            <Setter Property="HeaderTemplate"
                <Setter.Value> 
                    <DataTemplate> 
                        <Grid> 
                            <Grid.ColumnDefinitions> 
                                <ColumnDefinition Width="*"/> 
                                <ColumnDefinition Width="Auto"/> 
                            </Grid.ColumnDefinitions> 
                            <ContentControl Content="{Binding Table.Name}"/> 
                            <Button Grid.Column="1" Margin="3 0 0 0" Content="x" Width="16" 
                                       Height="16" HorizontalAlignment="Center" 
                                       VerticalAlignment="Center" 
                                       events:RoutedEventHelper.EnableRoutedClick="True" /> 
                        </Grid> 
                    </DataTemplate> 
                </Setter.Value> 
            </Setter> 
            <Setter Property="ContentTemplate"
                <Setter.Value> 
                    <DataTemplate> 
                        <Grid x:Name="grdTabs"
                                <Grid.RowDefinitions> 
                                    <RowDefinition Height="100"/> 
                                    <RowDefinition Height="*"/> 
                                </Grid.RowDefinitions> 
                            <Border x:Name="brdTableFields" Grid.Row="0" BorderThickness="1" BorderBrush="Black"
                            <Canvas Height="100" > 
                                <TextBlock Height="18" Width="45" TextWrapping="Wrap" Canvas.Left="9"  
                                           Canvas.Top="18"><Run Text="Name:"/><LineBreak/><Run Text=""/></TextBlock> 
                                <TextBox x:Name="txtTableName" Text="{Binding Table.Name, Mode=TwoWay}"  
                                         IsEnabled="{Binding Locked}" 
                                         Width="153" Canvas.Left="85" Canvas.Top="15" TextWrapping="Wrap"/> 
                                <TextBlock Height="15" Width="72" TextWrapping="Wrap" Canvas.Left="270"  
                                           Canvas.Top="18"><Run Text="Description:"/><LineBreak/><Run Text=""/></TextBlock> 
                                <TextBox x:Name="txtDescription" Text="{Binding Table.Description, Mode=TwoWay}"  
                                         IsEnabled="{Binding Locked}" 
                                         Width="193" Canvas.Left="381" Canvas.Top="15" TextWrapping="Wrap"/> 
                                <TextBlock Height="24" Width="78" TextWrapping="Wrap" Canvas.Left="8"  
                                           Canvas.Top="49"><Run Text="Parent Table:"/><LineBreak/><Run Text=""/></TextBlock> 
                                <telerikInput:RadComboBox x:Name="cbxParentTables" ItemsSource="{Binding OtherTables}"  
                                                          IsEnabled="{Binding Locked}" 
                                                          SelectedItem="{Binding SelectedParentTable, Mode=TwoWay}" 
                                                          DisplayMemberPath="Name" 
                                                          Height="24" Width="153" Canvas.Left="85" Canvas.Top="49"/> 
                                <TextBlock Height="15" Width="100" TextWrapping="Wrap" Canvas.Left="270" Canvas.Top="49"><Run Text="Decorator Class:"/><LineBreak/><Run Text=""/></TextBlock> 
                                <telerikInput:RadComboBox x:Name="cbxDecoratorClasses"  
                                                          ItemsSource="{Binding Decorators}" 
                                                          IsEnabled="{Binding Locked}" 
                                                          SelectedItem="{Binding SelectedDecorator, Mode=TwoWay}" 
                                                          Height="24" Width="193" Canvas.Left="381" Canvas.Top="49"/> 
                            </Canvas> 
                            </Border> 
                            <Grid x:Name="grdColumns" Grid.Row="1"
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition Width="260"/> 
                                    <ColumnDefinition Width="*"/> 
                                </Grid.ColumnDefinitions> 
                                <Grid.RowDefinitions> 
                                    <RowDefinition Height="*"/> 
                                    <RowDefinition Height="30"/> 
                                </Grid.RowDefinitions> 
                                <telerikNavigation:RadTreeView x:Name="treeColumnsGroups"  
                                                               Grid.Column="0" Grid.Row="0" 
                                                               ItemsSource="{Binding Columns}" 
                                                               ScrollViewer.VerticalScrollBarVisibility="Visible" 
                                                               SelectedItem="{Binding SelectedColumnGroup, Mode=TwoWay}" 
                                                               Selected="treeColumnsGroups_SelectedEvent"
                                        <telerikNavigation:RadTreeView.ItemTemplate> 
                                        <core:HierarchicalDataTemplate ItemsSource="{Binding Columns}" > 
                                            <TextBlock Text="{Binding Name}" Foreground="Black" FontSize="12"/> 
                                            </core:HierarchicalDataTemplate> 
                                        </telerikNavigation:RadTreeView.ItemTemplate> 
                                </telerikNavigation:RadTreeView> 
                                <StackPanel x:Name="stkColumnButtons"  HorizontalAlignment="Center" 
                                            Grid.Column="0" 
                                            Grid.Row="1" 
                                            Orientation="Horizontal" RenderTransformOrigin="0.627,0.449"
                                    <core:RadButton x:Name="btnNewColumn" Content="New" Width="100" 
                                                     Margin="0,0,10,0"/> 
                                    <core:RadButton x:Name="btnDeleteColGroup" Content="Delete" Width="100"/> 
                                </StackPanel> 
                                <views:ColumnGridView x:Name="colGrdView"  
                                                    Grid.Column="1" Grid.Row="0" 
                                                    Grid.RowSpan="2" 
                                                    DataContext="{Binding SelectedColumnGroup}"/> 
                            </Grid> 
                        </Grid> 
                    </DataTemplate> 
                </Setter.Value> 
            </Setter> 
        </Style> 
    </UserControl.Resources> 
 
    <Grid x:Name="LayoutRoot" Background="White" Width="1000"
        <telerikNavigation:RadTabControl x:Name="tbcTables" ItemsSource="{Binding Tables}" 
                                         SelectedItem="{Binding CurrentTable, Mode=TwoWay}" 
                                         ItemContainerStyle="{StaticResource ClosableStyle}"  
                                         Grid.Row="1" Grid.Column="1" Grid.RowSpan="2"/> 
        <Grid  d:LayoutOverrides="Height" Grid.Column="2" Grid.Row="1" > 
            <Grid.RowDefinitions> 
                <RowDefinition Height="20"/> 
                <RowDefinition Height="*"/> 
            </Grid.RowDefinitions> 
            <TextBlock TextWrapping="Wrap" Height="18" ><Run Text="Rules"/><LineBreak/><Run Text=""/></TextBlock> 
            <!--<ScrollViewer Height="212"/>--> 
            <ScrollViewer Grid.Row="1" /> 
        </Grid> 
 
    </Grid> 
</UserControl> 
 

0
Tina Stancheva
Telerik team
answered on 07 May 2010, 02:02 PM
Hello Derek Ealy,

Please take a look at this forum thread and let us know if you need more info.

Greetings,
Tina Stancheva
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Tags
TabControl
Asked by
Derek Ealy
Top achievements
Rank 1
Answers by
Derek Ealy
Top achievements
Rank 1
Tina Stancheva
Telerik team
Share this question
or