RadTreeView - MVVM - Select a item via code in ViewModel

6 posts, 0 answers
  1. Gopala
    Gopala avatar
    28 posts
    Member since:
    Jul 2012

    Posted 28 Mar 2013 Link to this post


    We are using RadTreeview in our application. We are using MVVM. I have an issue in selecting the item using code from my viewmodel. Please see below for my code in view.


    <telerik:RadTreeView ItemsSource="{Binding ReportRoots}"
                                 SelectionMode="Extended"
                                 IsEditable="False"
                                 Grid.Row="1"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"                           
                                 x:Name="rtvReportRoots"
                                 SelectedItem="{Binding SelectedReportRoot, Mode=TwoWay}">
                <telerik:RadTreeView.ItemTemplate>
                    <telerik:HierarchicalDataTemplate ItemsSource="{Binding Children}"
                                                      DataType="ViewModels:ReportRootEntityViewModel">
                        <Grid x:Name="NodeContainer">                       
                            <TextBlock Text="{Binding Path=Name}"
                                       Foreground="Gray"/>
                        </Grid>
                    </telerik:HierarchicalDataTemplate>
                </telerik:RadTreeView.ItemTemplate>
            </telerik:RadTreeView>

    In my viewmodel, at some point I am assigning SelectedReportRoot = reportRoot.

    At this point, I want to expand treeview , drill down, select a particular item, and move the selected item into view.

     

    I tried a lot but of no use. Any help is greatly appreciated

     

     

     

    With Regards,

    Gopala Chintakindi

    Extension : 8618

     

  2. Gopala
    Gopala avatar
    28 posts
    Member since:
    Jul 2012

    Posted 01 Apr 2013 Link to this post

    I was able to solve my issue. Please see below for what I did. Comments and suggestions are always welcomed to improve my code.

    In my UI I added this under UserControl.Resources

        <telerik:ContainerBindingCollection x:Key="BindingCollection">
                        <telerik:ContainerBinding PropertyName="IsSelected"
                                                  Binding="{Binding IsSelected,Mode=TwoWay}" />
                        <telerik:ContainerBinding PropertyName="IsExpanded"
                                                  Binding="{Binding IsExpanded, Mode=TwoWay}" />
                    </telerik:ContainerBindingCollection>

    I add below in my <telerik:RadTreeView.ItemTemplate>

        <telerik:RadTreeView.ItemTemplate>
                        <telerik:HierarchicalDataTemplate ItemsSource="{Binding Children}"
                                                          DataType="ViewModels:ReportRootEntityViewModel"
                                                          telerik:ContainerBinding.ContainerBindings="{StaticResource BindingCollection}">

    My ItemsSource is collection of ReportRootEntityViewModel. In this, I added three new properties.

    One is Parent of type ReportRootEntityViewModel.

    Two boolean properties IsSelected and IsExpanded

    Now it just matter of getting correct element and setting properties as below

        ReportRootEntityViewModel result = GetReportRootNode(Convert.ToInt32(data[0]), reportRoot.Children);
                    if (result != null)
                    {
                      if (_previousSelectedReportRoots != null)
                      {
                        _previousSelectedReportRoots.Parent.Parent.IsExpanded = false;
                        _previousSelectedReportRoots.Parent.IsExpanded = false;
                        _previousSelectedReportRoots.IsExpanded = false;
       
                        _previousSelectedReportRoots.IsSelected = false;
                      }
       
                      result.Parent.Parent.IsExpanded = true;
                      result.Parent.IsExpanded = true;
                      result.IsExpanded = true;
       
                      result.IsSelected = true;             
                      SelectedReportRoot = result;
                     
                      SelectedReportRootDisplayName = data[1];
                     DisplayLabel = "Display Name :";
                      _previousSelectedReportRoots = SelectedReportRoot;
                      return;
                    } 

     

     

  3. DevCraft banner
  4. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 02 Apr 2013 Link to this post

    Hello Gopala,

    I am glad that you found a solution, but let me just make a few notes on your approach.

    Firstly, please have in mind that with Silverlight 5 you can use Style bindings and this is why you don't need the ContainerBindingsCollection anymore. Instead you can apply an implicit (or explicit style through RadTreeView.ItemContainerStyle) targeting RadTreeViewItem:
    <Style TargetType="telerik:RadTreeViewItem">
        <Setter Property="IsSelected" Value="{Binding IsSelected,Mode=TwoWay}" />
        <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" />
    </Style>

    Also, as you need to bring an item into view, you can take advantage of the RadTreeView BringIntoView support and specifically in MVVM scenarios, we recommend using the BringPathIntoView() method further described in this tutorial.

    I hope that this additional information will help and please don't hesitate to write back with any questions.

    Regards,
    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  5. Gopala
    Gopala avatar
    28 posts
    Member since:
    Jul 2012

    Posted 02 Apr 2013 Link to this post

    Hi Tina,

    Thanks for your comments. I changed m\y RadTreeview as below and removed ContainerBindings

     

    <telerik:RadTreeView ItemsSource="{Binding ReportRoots}"  SelectionMode="Single"   IsDragDropEnabled="False" IsEditable="False"  Grid.Row="1"  HorizontalAlignment="Stretch"  VerticalAlignment="Stretch" IsDragTooltipEnabled="False" telerik:RadDragAndDropManager.AllowDrop="False"  Style="{StaticResource RadTreeViewInnerShadowStyle}"  x:Name="rtvReportRoots"  SelectedItem="{Binding SelectedReportRoot, Mode=TwoWay}" SelectionChanged="rtvReportRoots_SelectionChanged_1"  BringIntoViewMode="HeaderAndItems"> <telerik:RadTreeView.ItemContainerStyle>
    <Style TargetType="telerik:RadTreeViewItem">
        <Setter Property="IsSelected"  Value="{Binding IsSelected,Mode=TwoWay}" />
        <Setter Property="IsExpanded"  Value="{Binding IsExpanded, Mode=TwoWay}" />
    </Style>

    I donot know why but I cannot find BringPathIntoView for my RadTreeView. Can you please tell me which version of telerik has this method. I guess we are not using the version which has this method

     

  6. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 03 Apr 2013 Link to this post

    Hi Gopala,

    The method is available since the mid of 2010 and this is why you should be able to use it with any version of our controls released after Q2 2010 - v. 2010.2.0714. But if you're using an older version, please consider upgrading to the latest version - we'll release the Q1 2013 SP1 version by the end of next week and if you can upgrade, you will be able to use all new features of our controls. Additionally, the latest version always contain many bug fixes that can improve your application further.

    Regards,
    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  7. Gopala
    Gopala avatar
    28 posts
    Member since:
    Jul 2012

    Posted 03 Apr 2013 Link to this post

    I will discuss this with my team but as of now I solved my issue.
Back to Top
DevCraft banner