Self Reference Data-Binding

[Tooraj]

Hi,
I've read the self reference section in documentation but still I can not show my self referred data table in TreeView.
Step by Sptep help I need,
Thank you.

[Petar Mladenov]

Hi Tooraj,

 You can examine the attached project which is created by following the article. Please let us know if you need further assistance.

Kind regards,
Petar Mladenov
the Telerik team

[Tooraj]

thank you,
 your attachment doesn't provide what i want, I'm going to show my self referred table which has two fields named ChildID and ParentID and I'm going to show it in a hierarchical way.
STEP BY STEP HELP PLEASE!

[Petar Mladenov]

Hi Tooraj,

 You can examine this forum post and the attached runnable project in it. It demonstrates how to bind self-referencing table to RadTreeView via Ria Services. Please let us know if it satisfies you or if you have problems in re-implementing it at your side.

All the best,
Petar Mladenov
the Telerik team

[Susmitha]

Hi Petar ,

I have a question regarding the self reference  data-binding, this I faced during my application development .

As in the TreeViewSelfRefFilter solution you shared ,I have another observable collection of an object in DataItem class

so like,

 public ObservableCollection<ColorRange> colors         {             get;             set;         }

public ObservableCollection<DataItem> Children { get; set; }

where ColorRange is another type(just for example)

public class ColorRange     {
        public string Color
        {
            get;
            set;
        }
        public string Brush
        {
            get;
            set;
        }
    }

Then How can I bind this new object values to the treeview of DataItem?

I changed the converter to return the new object & bind the data. But that didn't work for me.

How can I solve this issue? It will be great if you can provide some insights for this problem

 

Thanks in advance

Susmitha

 

 

 

[Petar Mladenov]

Hi Susmitha,

Generally in order to bind the RadTreeView to objects of different types (in a single level) you need to ensure they have:

   - either common base class

   - or implement common interface

For example RadTreeView can be bound to collection of BaseClass objects. Lets suppose SubClassA and SubClassB inherit from BaseClass. In the model there can be a property defined like so:

public ObservaleCollection<BaseClass> SourceCollection
{
   get 
   {
         return this.CollectionOfSubClassA.Union(this.CollectionOfSubclassB);
   }
}

Same is true for the Converter in the Self_Referencing approach. Part of the converter's goal should be providing a unified collection of objects. The rest of the work is to organize your ViewModels in effective way - you may need an Interface to implement, or wrapper class, etc.

Regards,
Petar Mladenov
Progress Telerik

[Susmitha]

Thank you Petar for your reply.

I am not clear how can I achieve that.

So as the converter have the object(DataItem) which contains ColorRange   object for the current instance of DataItem do we have to again return the ColorRange   object & have a another template for that.

Is that what you meant?

If you don't mind could you please share some sample code with me.

Thanks & Regards

Susmitha

 

 

 

[Petar Mladenov]

Hi Susmitha,

To bring this forward faster, can you please share more from your model and its properties, also can you send us a sample tree structure of the desired result, for example

 Root

      DataItem

            Child1

            Child2

Having in mind your exact desired tree structure will help us better advice on your particular scenario.

Regards,
Petar Mladenov
Progress Telerik

[Susmitha]

Hi Petar,

Once again Thank you for the quick response

 

Please find the attached model class & tree view structure as below

Tree view Structure

-------------------

Units      

       Unit1

              Name

              Type

               Priority

               UnitData

               Datas         

               SubUnits     

       Unit2

               Name

               Type

               Priority

               UnitData

               Datas         

               SubUnits

      I am binding the treeview to ObservableCollection<Unit> .

 

Thanks & Regards

Susmitha

[Petar Mladenov]

Hello Susmitha,

I will list some steps you can try to implement on your side. First, I added ToString() overrides in your models and also two additional properties in the Unit class:

        public string DisplayName { get; set; }
        public IEnumerable<object> DisplayData
        {
            get
            {
                return new ObservableCollection<object>() { this.Name, this.Type, this.Priority, this.UnitData, this.Datas, this.SubUnits };
            }
        }

Neither ToString() nor these properties are mandatory, I will later explain how they can be replaced. 

Two words regarding the structure, it is a bit strange that the node of the Item shows "Item 1" but not the Name , in 99% of the tree structures, the node displays the Name / Label /ToString() of the business structure. Also, since you display several properties along with child objects you can consider using RadTreeListView - colums will display properties and child rows will display child objects. Of course it requires different organisation of XAML and models. Another idea is that you can set ItemTemplate for the RadTreeViewItem which shows several properties in a single panel, so instead of additional child items, this information can go into a single template, for example stack panel with several textblocks.

Below is the template structure I have used. Generally, every type of object has its dedicated template. All objects with no dedicated template use the StringTemplate which will use the ToString() override. So if you don't have control over the ToString() - imeplement additional template for every object that needs it.

  <Grid.Resources>

			<HierarchicalDataTemplate ItemsSource="{Binding}" x:Key="DatasTemplate">
				<TextBlock Text="Datas"/>
			</HierarchicalDataTemplate>

			<HierarchicalDataTemplate ItemsSource="{Binding}" x:Key="SunUnitsTemplate">
				<TextBlock Text="SubUnits"/>
			</HierarchicalDataTemplate>

			<DataTemplate x:Key="DataTemplate">
				<TextBlock Text="{Binding Content, StringFormat='Unitdata: {0}'}" />
			</DataTemplate>

			<DataTemplate x:Key="StringTemplate">
				<TextBlock Text="{Binding}" />
			</DataTemplate>

			<local:TemplateSelector x:Key="selector" 
            ToStringTemplate="{StaticResource StringTemplate}"
            UnitDataTemplate="{StaticResource DataTemplate}"
            DatasTemplate="{StaticResource DatasTemplate}"
            SubUnitsTemplate="{StaticResource SunUnitsTemplate}"/>

			<HierarchicalDataTemplate x:Key="rootTemplate" ItemsSource="{Binding DisplayData}" ItemTemplateSelector="{StaticResource selector}">
				<TextBlock Text="{Binding DisplayName}" />
			</HierarchicalDataTemplate>
        </Grid.Resources>

The rest of the work is to code a selector which decides which template to use:

public class TemplateSelector : DataTemplateSelector
    {
        public override DataTemplate SelectTemplate(object item, DependencyObject container)
        {
            if (item is UnitData)
            {
                return this.UnitDataTemplate;
            }
            else if (item is ObservableCollection<Data>)
            {
                return this.DatasTemplate;
            }
            else if (item is ObservableCollection<Unit>)
            {
                return this.SubUnitsTemplate;
            }
            return this.ToStringTemplate;
        }

You can find attached a resulting expanded tree.

Regarding the DisplayData property I have introduced. I hope you understand this is needed in order to give the treeview a collection of objects. If your project is in such phase that you cannot create viewmodel wrappers or you cannot introduce such properties to your existing models, this can be moved to Converter. For example this code

	<HierarchicalDataTemplate x:Key="rootTemplate" ItemsSource="{Binding DisplayData}"

is redirected to Unit

	<HierarchicalDataTemplate x:Key="rootTemplate" ItemsSource="{Binding  Converter="{StaticResource myConverter}"

In the converter you will have the unit object and in ConvertTo you can provide the same collection which DisplayData property does.

I hope these steps help you understand how treeview can be configured in a very different and complicated ways.

Regards,
Petar Mladenov
Progress Telerik

[Susmitha]

Hi Petar,

Thank you for sharing this information & the sample project .It worked for me with the template selector & ToString() override.

 

Regards

Susmitha

 

 

 

[Susmitha]

Hi Petar,

I had some requirement changes (display only the Name & type in the tree view & rest all properties on an edit window on click of the tree view item).So changed the template selector to "HierarchyConverter" and corresponding XAML changes all worked fine.

But some of the items have  lot of child nodes(in thousands), so don't want to display all the child nodes in the tree view.

As all the child nodes are similar planning to display a single node in the child node section, is there a possibility to do that ?At the same time the data context of parent node should contain all the child information so that editing will be possible.

So can we hide an tree view item ?


Regards
Susmitha

[Petar Mladenov]

Hi Susmitha,

In the last project, the root level data is organized in the DisplayData property of the Unit class. To hide the SubUnits ( for example) simply exclue the Subunits from the DisplayData:

        public IEnumerable<object> DisplayData
        {
            get
            {
                return new ObservableCollection<object>() { this.Name, this.Type, this.Priority, this.UnitData, this.Datas }; //this.SubUnits };
            }
        }

Unit class will still have the SubUnits as a property which you can use and bind in views outside treeview.

Regards,
Petar Mladenov
Progress Telerik

[Susmitha]

Hi Petar,

First of all thanks for the reply, as per my requirement the first subunit I have to display. So if I didn't have subunit then displaying the first unit will not be possible.

And as I am using Hierarchy converter am not using the Display data property now.

 Regards
Susmitha

[Petar Mladenov]

Hi Susmitha,

For hiding a particular RadTreeView from the UI, you can use its ItemVisibility property. In databound scenarios, the model of the item can use a bool or Visibility property and bind it to the RadTreeViewItem via Style:

pseudo code:

resources:
<telerik:BooleanToVisibilityConverter x:Key=converter />
<Style targettype=treeviewitem x:key=itemstyle
    <Setter property=ItemVisibility, Value={binding IsVisible, Converter = {StaticResource converter

mainwindow:

<telerik:RadTreeView ItemContainerStlye ={StaticResource itemstyle} />

Regards,
Petar Mladenov
Progress Telerik

[Susmitha]

Hi Petar,

I tried this ,the property updated to true or false as I requires, but still all the child tree items are present in the UI.

  Regards
Susmitha

[Petar Mladenov]

Hello Susmitha,

I encourage you to open a new support thread from your account with more details regarding your scenario and eventually an isolated sample. This post is really old and is getting too long and harder to maintain, so opening a new private thread will lower the response time, you will be able to attach project , and we will get faster to suggesting a possible solution. Thank you for your understanding.

Regards,
Petar Mladenov
Progress Telerik