Combining ItemsSource with Items.

[Jerome]

I'd like to have two top-level TreeView items, which are not related to bindings. Simple hard coded top-level items. However, those items will have children. And those children will be from my VM.

Something like this:

<telerik:RadTreeViewItem
    ItemsSource="{Binding DataContext.Documents, RelativeSource={RelativeSource AncestorType={x:Type telerik:RadTreeView}}}">
    <TextBlock
        Text="Documents" />
</telerik:RadTreeViewItem>
<telerik:RadTreeViewItem
    ItemsSource="{Binding DataContext.Pages, RelativeSource={RelativeSource AncestorType={x:Type telerik:RadTreeView}}}">
    <TextBlock
        Text="Excluded Pages" />
</telerik:RadTreeViewItem>

However, this doesn't seem to be allowed. How can I accomplish this? Essentially, my VM has two collections of stuff, and I want to show both in a single tree view, but without introducing a bunch of stuff into my view model.

[Kiril Vandov]

Hello Jerome,

Setting the binding like {Binding DataContext.Documents} will look for a Property with name"DataContext" in your view model, because the DataContext is already bound to the view model. Once the DataContext is set you can directly access the collection Documents like this {Binding Documents}.

I have made a sample solution demonstrating how to bind the RadTreeViewItems the way you want.

I hope this information helps, please don't hesitate to ask if you have further questions.

All the best,
Kiril Vandov
the Telerik team

[Andriy]

Hello!

I have the same question, but a little bit complicated.

Is it possible to get SelectedItem from Documents/Pages collection and bind to the property in ViewModel code?

For example: I have view model with two properties SelectedPage and SelectedDocument. I need to bind selected page to my view model in such way.

<telerik:RadTreeViewItem
    ItemsSource="{Binding DataContext.Pages, RelativeSource={RelativeSource AncestorType={x:Type telerik:RadTreeView}}}"
    SelectedItem="{Binding SelectedPage}">
    <TextBlock
        Text="Excluded Pages" />
</telerik:RadTreeViewItem>

[Kiril Vandov]

Hello Andriy,

The RadTreeViewItem does not have SelectedItem property but the RadTreeView does. That is why instead of binding to the ItemsSource of the RadTreeViewItem you could bind your collection to the RadTreeView ItemsSource. Then you can use the SelectedItem property of the RadTreeView.  Also the RadTreeViewItem is an ItemsControl and binding to its ItemsSource property while setting its children in xaml will result in an error, because you are trying to populate the Items collection twice - through declaratively added items in XAML and through the ItemsSource binding.

However if the approach described above does not work in your case, you could bind to the IsSelected property of the RadTreeViewItem. By doing so, when the selection is changed, the IsSelected property will be updated. In the property changed callback you could check from which collection the changed item is and set it to your SelectedPage or SelectedDocument properties.

I hope this information helps. Please let us know if we can further assist you or if we missed anything from your scenario.

Regards,
Kiril Vandov
Telerik