RadTabControl.ContentTemplate > ContentControl.Content binding exception

[Moch Yusup]

Hi,

I have a problem with binding custom ContentControl, in this case ViewContent (see code snippets), in RadTabControl.ContentTemplate. An exception occured when selecting tab item that has already been selected before. For example, there are 3 tab items (A,B,C), Firstly I select A and no error occurred, then I select B also no error occurred, but when I select A again, an exception occured stating "Element is already the child of another element.".

<telerik:RadTabControl x:Name="tabControlMatterDetails"
    SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
    SelectedIndex="0"
    ItemsSource="{Binding Service.Result}"
    DropDownDisplayMode="Visible"
    ScrollMode="Viewport">
    <telerik:RadTabControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Title}" ToolTipService.ToolTip="{Binding Description}" />
        </DataTemplate>
    </telerik:RadTabControl.ItemTemplate>
    <telerik:RadTabControl.ContentTemplate>
        <DataTemplate>
            <StackPanel Margin="20,10">
                <TextBlock Style="{StaticResource TitleText}" Text="{Binding Description}"/>
                <ContentControl VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" Content="{Binding ViewContent}"/>
            </StackPanel>
        </DataTemplate>
    </telerik:RadTabControl.ContentTemplate>
</telerik:RadTabControl>

I knew the exception triggered because the ViewContent which has been selected before has already had a parent, so I just created a converter to remove the parent if a ViewContent has already had a parent. But the problem is, in the previous version of the project which this codes is used had no problem like this, and we haven't changed anything related to this code. I have no idea why the error appeared all of a sudden.

Is the problem related to RadTabControl? how can I fix the problem without doing workaround like this? Thanks.

Cheers,

[Pavel R. Pavlov]

Hi Moch,

I managed to reproduce your issue. The exception is caused because you are trying  to bind a visual element (as the ViewContent) to the RadTabControl.ContentTemplate. It is considered as bad practice to have visual objects in the ViewModel. You can avoid such implementation by using the ContentTemplateSelector property of the RadTabControl and different DataTemplates for each RadTabItem. However, the good news is that there is a property that can solve the issue called SupressSelectedContentTemplateReapplying. You can read more information in this article. If you set the SupressSelectedContentTemplateReapplying property to True this will allow you to place visual elements in the RadTabControl.ItemsSource collection.

Greetings,
Pavel R. Pavlov
the Telerik team

[Moch Yusup]

It's solved.

Thanks Pavel, that's help me a lot. :)