Expander HeaderTemplate cannot access Expander's DataContext

[Joe]

My problem is simple: In my RadExpander header template, I am unable to access the properties of the data context of the expander itself.  Why does the header not have the same data context?

Here is a simple example:  A main Window with a label and a RadExpander (with HeaderTemplate).  The simple label easily accesses the "Name" property.  The RadExpander's HeaderTemplate cannot

 

<Window x:Class="TestTelerik.MainWindow"
                xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                xmlns:tk="http://schemas.telerik.com/2008/xaml/presentation"
                xmlns:testTelerik="clr-namespace:TestTelerik"
                Title="MainWindow" Height="350" Width="525"
                >
    <StackPanel>

        <!-- This shows up just fine -->

       <Label Content="{Binding HeaderTitle}"/>

        <tk:RadExpander>
            <tk:RadExpander.HeaderTemplate>
                <DataTemplate>
                     <!-- This does not show.  Why not? -->
                    <Label Content="{Binding HeaderTitle}"/>
                </DataTemplate>
            </tk:RadExpander.HeaderTemplate>
        </tk:RadExpander>
    </StackPanel>
</Window>

 

The DataContext of this window is just itself:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = this;
    }

    public string HeaderTitle => "Items!";
}

My real-world use case it actually quite a bit more complicated so it's not a viable solution for me to try to bind the "RadExpander.Header" property directly. 

Nor can I use the  "ElementName=" binding syntax.  Not in my case

What is the best way to make the RadExpander HeaderTemplate inherit its the RadExpander's  data context?

 

[Joe]

After some checking on StackOverflow and talking it over with others, I have been made to understand that I can get at the expander's DataContext with a pretty complicated databinding that looks up the visual tree for the first instance of RadExpander.  I changed my sample expander XAML to look like this and it seems to work:

<tk:RadExpander>
    <tk:RadExpander.HeaderTemplate>
        <DataTemplate>
            <Label Content="{Binding Path=DataContext.HeaderTitle, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type tk:RadExpander}}}"/>

        </DataTemplate>
    </tk:RadExpander.HeaderTemplate>
</tk:RadExpander>

 

Is this this thing I need to do for any HeaderTemplate?  Is there some simpler way I'm missing?  It just seems really odd.

 

[Martin Ivanov]

Hello Joe,

The relative source binding is one way to go. The other one is to set the Header property of the RadExpander control. Actually, the data context of the HeaderTemplate is the content of the Header property.

You will notice this behavior also in the WPF native ContentControl. There the ContentTemplate doesn't know about the DataContext of the control. Instead it uses the Content property.

Regards,
Martin Ivanov
Progress Telerik