How to Bind RadTreeView to Hierarchical Data

2 posts, 0 answers
  1. Dais
    Dais avatar
    1 posts
    Member since:
    Mar 2012

    Posted 06 May 2012 Link to this post

    hello
    I have three dependent tables : Module(idmod,libelle),Fonctionnalite(idfonc,idmod,libelle),SousFonctionnalite(idsf,idfonc,libelle)
    I want to exploit those tables in a RadtreeView like :
    M1             (level 1)
       F1                (level 2)
           SF11         ( level 3)
           SF12
       F2
          SF21
          SF22
    M2

    The problem is i can't associate (using C#)my data presented above with my XAML code! so can anyone help me ? if you need more information just let me know, thank you in advance for your help!

    this is my XAML code :
    <UserControl.Resources>
            <local:DataSource x:Key="TreeViewDataSource"/>
            <!--Data template for the SousFonctionnalite object-->
            <telerik:HierarchicalDataTemplate x:Key="SousFonctionnaliteTemplate">
                <TextBlock Text="{Binding libelle}" Foreground="Red" FontSize="16" FontFamily="Verdana" />
            </telerik:HierarchicalDataTemplate>
            <!--Data template for the Fonctionnalite object-->
            <telerik:HierarchicalDataTemplate  
        x:Key="FonctionnaliteTemplate"  
        ItemTemplate="{StaticResource SousFonctionnaliteTemplate}"
        ItemsSource="{Binding sousfonctionnalites}">
                <TextBlock Text="{Binding libelle}" Foreground="Blue" FontSize="22" FontFamily="Verdana" />
            </telerik:HierarchicalDataTemplate>
            <!--Data template for the Module object-->
            <telerik:HierarchicalDataTemplate  
        x:Key="ModuleTemplate"  
        ItemTemplate="{StaticResource FonctionnaliteTemplate}"
        ItemsSource="{Binding fonctionnalites}">
                <TextBlock Text="{Binding libelle}" Foreground="Green" FontSize="28" FontFamily="Verdana" />
            </telerik:HierarchicalDataTemplate>
        </UserControl.Resources>

        <Grid Background="{x:Null}" Height="220"  Name="grid1" Width="400" >
            <Rectangle Fill="WhiteSmoke" Height="220" HorizontalAlignment="Center" Name="PanelLogin" RadiusX="18" RadiusY="18" Stroke="#FF2892F2" StrokeThickness="2" VerticalAlignment="Bottom" Width="400">
                <Rectangle.Effect>
                    <DropShadowEffect BlurRadius="4" Color="#3B000000" Opacity="0.4" ShadowDepth="2" />
                </Rectangle.Effect>
            </Rectangle>
            <Border
    CornerRadius="5"
    BorderBrush="BlanchedAlmond"
    BorderThickness="1"
    HorizontalAlignment="Left" MinHeight="160"
    MinWidth="380" Width="380" Margin="10,25,0,35">
                <!--Tree view goes here-->
                <telerik:RadTreeView ItemsOptionListType="CheckList" IsOptionElementsEnabled="True" IsRootLinesEnabled="True" Margin="5" x:Name="tvMain" IsTriStateMode="True" SelectionMode="Multiple"      
        ItemsSource="{Binding Source={StaticResource TreeViewDataSource}}"
        ItemTemplate="{StaticResource ModuleTemplate}" >
                    
                </telerik:RadTreeView>

            </Border>
            <Button Background="WhiteSmoke" BorderBrush="#FF2892F2" BorderThickness="2"  Content="Valider" FontFamily="Arial" FontSize="12" FontStretch="UltraExpanded" FontStyle="Normal" Foreground="#FF2892F2" HorizontalAlignment="Right" HorizontalContentAlignment="Center" Margin="0,183,130,12" Name="validerBT" VerticalContentAlignment="Center" Width="96" Click="validerBT_Click" />
            <Button Background="WhiteSmoke" BorderBrush="#FF2892F2" BorderThickness="2"  Content="Annuler" FontFamily="Arial" FontSize="12" FontStretch="UltraExpanded" FontStyle="Normal" Foreground="#FF2892F2" HorizontalAlignment="Right" HorizontalContentAlignment="Center" Margin="0,183,20,12" Name="annulerBT" VerticalContentAlignment="Center" Width="96" Click="annulerBT_Click" />

            <Rectangle Height="1" HorizontalAlignment="Center" Margin="25,30,25,0" Name="rectangle1" RadiusX="10" RadiusY="10" Stroke="#FF2892F2" StrokeThickness="1" VerticalAlignment="Top" Width="350">
                <Rectangle.Effect>
                    <DropShadowEffect BlurRadius="4" Color="#3B000000" Opacity="0.4" ShadowDepth="2" />
                </Rectangle.Effect>
            </Rectangle>
            <sdk:Label Content="Veuillez Séléctionner les droits de ce profil" FlowDirection="LeftToRight" FontFamily="Arial" FontSize="14" Foreground="#FF2892F2" Height="24" HorizontalAlignment="Left" HorizontalContentAlignment="Center" Margin="25,0,0,195" Name="PasswordPageNameLB" VerticalAlignment="Bottom" Width="275" />
            <telerik:RadTreeView Height="250" HorizontalAlignment="Left" Margin="120,82,0,0" Name="radTreeView1" VerticalAlignment="Top" Width="150">
                <telerik:RadTreeViewItem  Header="Item 1"   ItemTemplate="{StaticResource ModuleTemplate}" ItemsSource="{Binding Source={StaticResource FonctionnaliteTemplate}, NotifyOnValidationError=True, ValidatesOnDataErrors=True, ValidatesOnExceptions=True, BindsDirectlyToSource=True, Path=ItemsSource.BindsDirectlyToSource}" />
            </telerik:RadTreeView>
        </Grid>

    </UserControl>
  2. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 08 May 2012 Link to this post

    Hello Dais,

    Please have a look at this tutorial as it can take you through the task of binding the RadTreeView control to a collection of businesses items. Let us know if it helps or if we can further assist you.

    Regards,
    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  3. DevCraft banner
Back to Top