Load TreeListView data

10 posts, 0 answers
  1. Fabiana
    Fabiana avatar
    69 posts
    Member since:
    Oct 2009

    Posted 18 Nov 2009 Link to this post

    Hello!


    I am trying to add information into Telerik TreeListView control.

    I did a simple example with 3 columns, but I don´t know how to load information into TreeListView.

    See my example. I would like to load data using my Class LoadData(). How to set PARENT NODE into TreeListView ? Is there another way to do it?

    Thanks!!

    public class DataSource : List<Organization>
        {
            public DataSource()
            {
                Organization org = new Organization("OrganizationXYZ", false, true);
                Department Sales = new Department("Sales", false, true);
                Department Marketing = new Department("Marketing", false, false);

                org.Departments.Add(Sales);
                org.Departments.Add(Marketing);

                Sales.Employees.Add(new Person("Person1", true));
                Sales.Employees.Add(new Person("Person2", false));
                Sales.Employees.Add(new Person("Person3", false));

                Marketing.Employees.Add(new Person("Person4", false));
                Marketing.Employees.Add(new Person("Person5", false));

                this.Add(org);
            }
        }

    ______

    public class Organization : INotifyPropertyChanged
        {
            public event PropertyChangedEventHandler PropertyChanged;

            private string name;
            private bool selected = false;
            private bool expanded = false;

            public Organization(string name)
            {
                this.name = name;
                Departments = new List<Department>();
            }
            
            public Organization(string name, bool selected, bool expanded)
            {
                this.name = name;
                this.selected = selected;
                this.expanded = expanded;
                Departments = new List<Department>();
            }

            public string Name
            {
                get
                {
                    return this.name;
                }
                set
                {
                    if (value != this.name)
                    {
                        this.name = value;
                        NotifyPropertyChanged("Name");
                    }
                }
            }

            public bool Selected
            {
                get
                {
                    return this.selected;
                }
                set
                {
                    if (value != this.selected)
                    {
                        this.selected = value;
                        NotifyPropertyChanged("Selected");
                    }
                }
            }

            public bool Expanded
            {
                get
                {
                    return this.expanded;
                }
                set
                {
                    if (value != this.expanded)
                    {
                        this.expanded = value;
                        NotifyPropertyChanged("Expanded");
                    }
                }
            }

            public List<Department> Departments
            {
                get;
                set;
            }

            private void NotifyPropertyChanged(string propertyName)
            {
                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
                }
            }
        }

    ______

    public class Department : INotifyPropertyChanged
        {
            public event PropertyChangedEventHandler PropertyChanged;

            private string name;
            private bool selected = false;
            private bool expanded = false;

            public Department(string name)
            {
                this.name = name;
                Employees = new List<Person>();
            }

            public Department(string name, bool selected, bool expanded)
            {
                this.name = name;
                this.selected = selected;
                this.expanded = expanded;
                Employees = new List<Person>();
            }

            public string Name
            {
                get
                {
                    return this.name;
                }
                set
                {
                    if (value != this.name)
                    {
                        this.name = value;
                        NotifyPropertyChanged("Name");
                    }
                }
            }

            public bool Selected
            {
                get
                {
                    return this.selected;
                }
                set
                {
                    if (value != this.selected)
                    {
                        this.selected = value;
                        NotifyPropertyChanged("Selected");
                    }
                }
            }

            public bool Expanded
            {
                get
                {
                    return this.expanded;
                }
                set
                {
                    if (value != this.expanded)
                    {
                        this.expanded = value;
                        NotifyPropertyChanged("Expanded");
                    }
                }
            }

            public List<Person> Employees
            {
                get;
                set;
            }

            private void NotifyPropertyChanged(string propertyName)
            {
                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
                }
            }
        }

    ______

    public class Person : INotifyPropertyChanged
        {
            public event PropertyChangedEventHandler PropertyChanged;
            private string name;
            private bool selected = false;

            public Person(string name)
            {
                this.name = name;
            }

            public Person(string name, bool selected)
            {
                this.name = name;
                this.selected = selected;
            }

            public string Name
            {
                get
                {
                    return this.name;
                }
                set
                {
                    if (value != this.name)
                    {
                        this.name = value;
                        this.NotifyPropertyChanged("Name");
                    }
                }
            }

            public bool Selected
            {
                get
                {
                    return this.selected;
                }
                set
                {
                    if (value != this.selected)
                    {
                        this.selected = value;
                        NotifyPropertyChanged("Selected");
                    }
                }
            }

            private void NotifyPropertyChanged(string propertyName)
            {
                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
                }
            }
        }

    ______

     <telerikNavigation:RadTreeListView IsLineEnabled="True" IsEditable="True"
                                            x:Name="RadTreeListView1" Background="White" Margin="10,94,10,309"
                                            BorderBrush="#a9a9a9" BorderThickness="1" SelectionMode="Multiple">
                
                <telerikNavigation:RadTreeListView.Columns>
       
                    <telerikNavigation:RadColumn x:Name="RadColumnName" PropertyName="Name" Header="Name">
                        <telerikNavigation:RadColumn.CellTemplate>
                            <DataTemplate>
                                <TextBlock Text="" VerticalAlignment="Center"/>
                            </DataTemplate>
                        </telerikNavigation:RadColumn.CellTemplate>
                    </telerikNavigation:RadColumn>
                    
                    
                    <telerikNavigation:RadColumn x:Name="RadColumnSelected" PropertyName="Selected" Header="Selected">
                        <telerikNavigation:RadColumn.CellTemplate>
                            <DataTemplate>
                                <TextBlock Text="" VerticalAlignment="Center"/>
                            </DataTemplate>
                        </telerikNavigation:RadColumn.CellTemplate>
                    </telerikNavigation:RadColumn>
                    
                    <telerikNavigation:RadColumn x:Name="RadColumnExpanded" PropertyName="Expanded" Header="Expanded">
                        <telerikNavigation:RadColumn.CellTemplate>
                            <DataTemplate>
                                <TextBlock Text="" VerticalAlignment="Center" />
                            </DataTemplate>
                        </telerikNavigation:RadColumn.CellTemplate>
                    </telerikNavigation:RadColumn>
                    
                </telerikNavigation:RadTreeListView.Columns>
            </telerikNavigation:RadTreeListView>

    _______

     private void LoadData()
            {
                DataSource dt = new DataSource();

                if (dt != null)
                {
                    //Add Organization Name
                    this.RadTreeListView1.Items.Add(dt[0].Name);

                    for (int i = 0; i < dt[0].Departments.Count; i++)
                    {
                        //Add Departments Name into Organization ?????????????????? ADD IT INTO A PARENT NODE !!!
                        this.RadTreeListView1.Items.Add(dt[0].Departments[i].Name);

                        for (int j = 0; j < dt[0].Departments[i].Employees.Count; j++)
                        {
                            //Add Employees Name into Departments ??????????????????????  ADD IT INTO A PARENT NODE !!!
                            this.RadTreeListView1.Items.Add(dt[0].Departments[i].Employees[j].Name);
                        }

                    }

                }
            }

  2. Florian Perrichot
    Florian  Perrichot avatar
    4 posts
    Member since:
    Oct 2009

    Posted 18 Nov 2009 Link to this post

    Hi Fabiana,

    I think you don't need to create manually your Tree.
    You can use your Datasource. You may only need to replace your List<T> by ObservableCollection<T> (It works for me).

    this.RadTreeListView1.ItemsSource = new DataSource(); 

    Regards,

    Florian

  3. Download a free trial of UI for WPF
  4. Fabiana
    Fabiana avatar
    69 posts
    Member since:
    Oct 2009

    Posted 19 Nov 2009 Link to this post

    Hello Florian,

    I replaced by System.Collections.ObjectModel.ObservableCollection, but I didn´t see correct information in RadTreeListView. Can you see my code example... and send for me your correct code , that works for you ? See my image.
    Thanks.



    this.RadTreeListView1.ItemsSource = new DataSource();


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

    namespace RadTreeViewContainerBindings
    {
        public class DataSource : System.Collections.ObjectModel.ObservableCollection<Organization>
        {

            public DataSource()
            {

                Organization abc= new Organization("abc", false, true);
                Department Developer = new Department("Deselvolvimento", false, true);
                Department Marketing = new Department("Marketing", false, false);

                abc.Departments.Add(Developer);
                abc.Departments.Add(Marketing);

                Developer.Employees.Add(new Person("1", true));
                Developer.Employees.Add(new Person("2", false));
                Developer.Employees.Add(new Person("3", false));

                Marketing.Employees.Add(new Person("4", false));
                Marketing.Employees.Add(new Person("5", false));

                this.Add(abc);
       
            }


        }
    }


       


  5. Florian Perrichot
    Florian  Perrichot avatar
    4 posts
    Member since:
    Oct 2009

    Posted 19 Nov 2009 Link to this post

    It seems to works (you have the right object in the root of your tree). But now, you need to create the graphical part with some HierarchicalDataTemplate. I think you need at least one template for each type in your hierarchy.

    An example with the same data model (3 nested collections) can be found in the telerik demo site :
    http://demos.telerik.com/silverlight/#TreeView/HierarchicalTemplate

  6. Bobi
    Admin
    Bobi avatar
    513 posts
    Member since:
    Sep 2012

    Posted 24 Nov 2009 Link to this post

    Hi Florian Perrichot,

    Thank you for your interest in the TreeListView.
    First I want to underline that this is a CTP version of the control and a lot has not been implemented / fixed yet.
    The control is meant for editing and viewing. In fact we aim to abstract the data manipulations well, so that it will be usable in many scenarios. It will eventually support multiple editing of items (similarly to when you select many items in Windows Explorer and edit their name).

    The other novel thing is to represent the columns as just a collection of hierarchical items so that standard binding rules will apply there as well.

    I am attaching the example that we used to make the Screenshots for the product page. It shows how you can implement editing. You can also take a look at the following online example:
    http://demos.telerik.com/silverlight/#TreeListView/FirstLook

    I understand that we have not provided documentation for the control yet, we are going to include documentation and more samples once it is officially released. Until then, my advice is to use the control as a preview only and not base any production code on it.

    Of course we will be happy to help with any questions you may have. Your feedback will be appreciated.

    Best wishes,
    Boryana
    the Telerik team


    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

  7. Dat Huynh
    Dat Huynh avatar
    1 posts
    Member since:
    Dec 2009

    Posted 03 Jan 2010 Link to this post

    Hi Boryana,
    I am quite interested in the sample you provided 157524-treelisttest-2.zip it's great and was wondering whether you
    had a more general sample (instead of Folder/File/Diskbase ...items) with a more general hierarchical data struct from the database.
    I am intending to use the TreeListView to allow administration to maintain a user-role based menu structure.

    I used RadMenu to build a user-role based (Admin,Manager,AdvancedUser,Guest ... roles) menu. And for editing the user-role based
    menu (CRUD) i believe that the treelistview is the best candidate. I intend to  display the hierarchical menu structure as a treeview on the left hand side while on the right hand side there will be as many columns as there are as many roles displayed as selectable checkboxes/radiobuttons associated with the menu-item shown on the right hand side.

    Many thanks
    Dat

  8. Bobi
    Admin
    Bobi avatar
    513 posts
    Member since:
    Sep 2012

    Posted 07 Jan 2010 Link to this post

    Hello Dat Huynh,

    Currently the TreeListView is a CTP and I expect that you may run into issues with features that are simply not ready yet. The API of the control may also change a bit, although not drastically. So we would advice you to use RadGridView in order to accomplish the desired functionality.
    Thank you for the interest in our controls. Any feedback  is highly appreciate.

    Best wishes,
    Boryana
    the Telerik team


    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

  9. David Cardona
    David Cardona avatar
    20 posts
    Member since:
    Mar 2010

    Posted 08 Apr 2010 Link to this post

    HI.

    First, thank you for the example, it is so great.

    Second, I have a question:  where do you fill the Observable Collection for the TreeViewList Binding ?

    In the Telerik Package Example you fill through a XML file. In your example through an ObservableCollection, but I don't  find where you fill that ObservableCollections.

    Thank you so much

  10. Miroslav
    Admin
    Miroslav avatar
    922 posts
    Member since:
    Sep 2012

    Posted 13 Apr 2010 Link to this post

    Hello David Cardona,

    The root items collection is created in the

    GenerateItemsSource() method on the main user control.

    Then each item creates its title and children on demand in the BuidTitle() and BuildChildrenI() respectively.

    Hopefully this will help you,

    All the best,
    Miroslav
    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.

  11. David Cardona
    David Cardona avatar
    20 posts
    Member since:
    Mar 2010

    Posted 13 Apr 2010 Link to this post

    Thank you so much Admin for that response!


Back to Top
Download a free trial of UI for WPF