TreeView Load on Demand with RIA stalling

[Christine]

Hi -

I have a treeview set up very much like the example found at this post: http://www.telerik.com/community/forums/silverlight/treeview/load-on-demand-using-wcf-ria-serices.aspx.  The initial load works like it should but when I click on one of the nodes it shows a rotating arrow and never expands.  I've stepped through the code and the entities are being pulled so I know that part is working but there must be something else I'm missing.  Any ideas what that might be?

My xaml looks like:

<UserControl.Resources>
        <DataTemplate x:Key="PageTemplate">
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="Page: " FontSize="9"/>
                <TextBlock Text="{Binding PageName}" FontSize="9"/>
            </StackPanel>
        </DataTemplate>

        <telerik:HierarchicalDataTemplate x:Key="FolderTemplate" ItemsSource="{Binding Folders}" ItemTemplate="{StaticResource PageTemplate}">
            <StackPanel Orientation="Horizontal">
                <!--<TextBlock Text="Folder:" FontSize="9"/>-->
                <TextBlock Text="{Binding FolderName}" FontSize="9"/>
                <telerikMenu:RadContextMenu.ContextMenu>
                    <telerikMenu:RadContextMenu x:Name="treeContextMenu" Opened="treeContextMenu_Opened">
                        <telerikMenu:RadMenuItem Header="New Folder" Click="ContextMenu_NewFolderClick"/>
                        <telerikMenu:RadMenuItem Header="New Page" Click="ContextMenu_NewPageClick"/>
                        <telerikMenu:RadMenuItem Header="Secure" Click="ContextMenu_SecureClick"/>
                        <telerikMenu:RadMenuItem Header="Manage" Click="ContextMenu_ManageClick"/>
                    </telerikMenu:RadContextMenu>
                </telerikMenu:RadContextMenu.ContextMenu>
            </StackPanel>
        </telerik:HierarchicalDataTemplate>

    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">

        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <ScrollViewer VerticalScrollBarVisibility="Visible" Grid.Row="1" >
            <telerikNavigation:RadTreeView x:Name="myTreeView" ItemTemplate="{StaticResource FolderTemplate}" IsLineEnabled="True"
                                       IsLoadOnDemandEnabled="True" LoadOnDemand="myTreeView_LoadOnDemand" IsVirtualizing="True"
                                       ItemPrepared="myTreeView_ItemPrepared" Selected="myTreeView_Selected"   />
        </ScrollViewer>
</Grid>
</UserControl>

and the code behind:

public NavTreeView()
        {
            InitializeComponent();
            this.DataContext = new MAGIC.ViewModels.MainViewModel();
            this.Loaded += new RoutedEventHandler(TreeViewPage_Loaded);
            this.myTreeView.AddHandler(RadTreeView.KeyDownEvent, new KeyEventHandler(TreeEntryControl_KeyDown), true);
        }

        void TreeViewPage_Loaded(object sender, RoutedEventArgs e)
        {
            this.myTreeView.ItemsSource = context.Folders;
            context.Load(context.GetFoldersQuery());
        }

        void operation_Completed(object sender, EventArgs e)
        {
            ObservableCollection<Entity> wrapCollection = new ObservableCollection<Entity>((sender as LoadOperation).Entities);
            this.myTreeView.ItemsSource = wrapCollection;
        }


        private void myTreeView_LoadOnDemand(object sender, Telerik.Windows.RadRoutedEventArgs e)
        {
            // get the treeview
            RadTreeView tree = sender as RadTreeView;
            // get the clicked Item
            RadTreeViewItem clickedItem = e.OriginalSource as RadTreeViewItem;

            if (clickedItem.Item as Folder != null)
            {
                //var test = (clickedItem.Item as Folder).FolderId;
                context.Load(context.GetPagesQuery((clickedItem.Item as Folder).FolderId));
            }
            //if need another level of tree, insert "else if" statement here
        }

        private void myTreeView_ItemPrepared(object sender, RadTreeViewItemPreparedEventArgs e)
        {
            if (e.PreparedItem.Item is MAGIC.Data.Page)
            {
                e.PreparedItem.IsLoadOnDemandEnabled = false;
            }
        }

Thanks!

[Petar Mladenov]

Hi Christine,

You still need implement more logic in your application. Clicking on a second level Item means that you have to make a check logic for the item`s type like the one you have created for the Folder:

if (clickedItem.Item as Folder != null)
            {
                //var test = (clickedItem.Item as Folder).FolderId;
                context.Load(context.GetPagesQuery((clickedItem.Item as Folder).FolderId));
            }
            //if need another level of tree, insert "else if" statement here
        }

You can see in the example in the forum :

private void myTreeView_LoadOnDemand(object sender, Telerik.Windows.RadRoutedEventArgs e)
        {
            // get the treeview
            RadTreeView tree = sender as RadTreeView;
            // get the clicked Item
            RadTreeViewItem clickedItem = e.OriginalSource as RadTreeViewItem;

            if (clickedItem.Item as Customer != null)
                context.Load(context.GetCustomerOrdersQuery((clickedItem.Item as Customer).CustomerID));
            else if (clickedItem.Item as Order != null)
                context.Load(context.GetOrderDetailsQuery((clickedItem.Item as Order).OrderID));
        }

We have checks wheter the clicked item is Customer or Order. Please let us know if this pointed you to the right direction.

Best wishes,
Petar Mladenov
the Telerik team