LoadOnDemand requires second click

[Jacek Dudziak]

I am doing something wrong but I cannot figure out what. I am trying to populate top level node after somebody clicks on it. The code executes as expected, but after the click, Clusters node remains collapsed and arrow keeps spinning just like it would be retrieving data and waiting. However if I click on Clusters node again - it immediately expands - the way I was hoping to get it after first click.
In debugger, the second click does not invoke LoadOnDemand handler - the first click does populate my class with data. So why the Cluster node does not pick it up?

Server nodes which are one level below clusters work perfectly fine.

Thanks

[Kiril Stanoev]

Hi Jacek,

After you populate the Clusters node, you need to set its IsLoadingOnDemand property to false. For example:

<telerik:RadTreeView x:Name="treeView1" IsLoadOnDemandEnabled="True"
        LoadOnDemand="treeView1_LoadOnDemand" />

public MainPage()
{
    InitializeComponent();
    this.treeView1.ItemsSource = Enumerable.Range(0, 5);
}

private void treeView1_LoadOnDemand(object sender, Telerik.Windows.RadRoutedEventArgs e)
{
    RadTreeViewItem item = e.OriginalSource as RadTreeViewItem;
    item.ItemsSource = Enumerable.Range(0, 5);
    item.IsLoadingOnDemand = false;
}

Give it a try and let me know how it works.

All the best,
Kiril Stanoev
the Telerik team

[Jacek Dudziak]

I have tried it. Now the result is that after Silverlight control is loaded and initialized, I have one tree item called Clusters. When I click on it for the first time - nothing visible happens. After I click for the second time - the Cluster node 'opens' and shows all children - clusters.
Under debugger, the first click makes the call to LoadOnDemand, while the second click does not invoke it anymore. So the only one thing that is missing - the Cluster node does not expand after getting data from the first 'click'.

[Petar Mladenov]

Hi Jacek Dudziak,

The circle indicating the load operation in progress  is not shown probably because the load operation lasts too little time. So you can implement DispatcherTimer logic in order to slow down this process and see the circle like in this demo. On the other hand, does expanding the clicked RadTreeViewitem from code behind could fit in your scenario? You could also send us runnable sample so that we could provide you with a better suited solution. Thank you in advance for your cooperation.

Regards,
Petar Mladenov
the Telerik team

[Jacek Dudziak]

The difference between your and my example is that I am using async WCF service, while you are creating collection on the fly. I am not sure how to sent working solution without service and DB, so let me just repost my code: it is as simple as I can make it.

Here is the source of my data. This makes a call to basic WCF service.

using System;
using System.Collections.ObjectModel;
using Microsoft.Webstore.Console.SiteMetadataProxy;

namespace Microsoft.Webstore.Console.ViewModels
{
    public class ClusterViewModel: ViewModelBase
    {
        private readonly SiteMetadataClient client = new SiteMetadataClient();
        private ObservableCollection<Cluster> clusters;

        public ObservableCollection<Cluster> Clusters
        {
            get { return clusters; }
            set
            {
                if (clusters != value)
                {
                    clusters = value;
                    OnPropertyChanged("Clusters");
                }
            }
        }

        public void GetClusters()
        {
            client.ClusterGetAllCompleted += GetClustersEnd;
            client.ClusterGetAllAsync(this);
        }

        private static void GetClustersEnd(Object sender, ClusterGetAllCompletedEventArgs args)
        {
            var model = args.UserState as ClusterViewModel;
            if (model != null && args.Error == null && !args.Cancelled)
            {
                model.Clusters = args.Result;
            }
        }

        public void GetServersData(Cluster cluster)
        {
            client.ServerGetByClusterIdCompleted += GetServersDataEnd;
            client.ServerGetByClusterIdAsync(cluster.ClusterUid, cluster);
        }

        private static void GetServersDataEnd(Object sender, ServerGetByClusterIdCompletedEventArgs args)
        {
            var c = args.UserState as Cluster;
            if (c != null && args.Error == null && !args.Cancelled)
            {
                c.DataServers = args.Result;
            }
        }
    }
}

Here is my XAML

<UserControl x:Class="Microsoft.Webstore.Console.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:viewModels="clr-namespace:Microsoft.Webstore.Console.ViewModels"
        mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
    <UserControl.Resources>
        <viewModels:ClusterViewModel x:Key="ClusterViewModel"/>
        <DataTemplate x:Key="ServerTemplate">
            <TextBlock Text="{Binding ServerName}"/>
        </DataTemplate>
        <telerik:HierarchicalDataTemplate x:Key="ClusterTemplate"
                                          ItemTemplate="{StaticResource ServerTemplate}"
                                          ItemsSource="{Binding DataServers}">
            <TextBlock Text="{Binding ClusterName}"/>
        </telerik:HierarchicalDataTemplate>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot">
        <telerik:RadSplitContainer x:Name="MainContainer">
            <telerik:RadPaneGroup x:Name="NavigationGroup"
                                    TabStripPlacement="Top"
                                    telerik:ProportionalStackPanel.RelativeSize="30,0">
                <telerik:RadPane x:Name="Servers"
                                    Header="Servers">
                    <telerik:RadTreeView HorizontalAlignment="Stretch"
                                         VerticalAlignment="Stretch"
                                         Name="clusterTree"
                                         IsLoadOnDemandEnabled="True"
                                         LoadOnDemand="ClusterLoadOnDemand"
                                         IsExpandOnSingleClickEnabled="False"
                                         ItemPrepared="ClusterTreeItemPrepared">
                        <telerik:RadTreeViewItem Header="Clusters"
                                                 ItemTemplate="{StaticResource ClusterTemplate}"
                                                 ItemsSource="{Binding Source={StaticResource ClusterViewModel}, Path=Clusters}"
/>
                    </telerik:RadTreeView>
                </telerik:RadPane>
            </telerik:RadPaneGroup>
            <telerik:RadPaneGroup x:Name="DetailGroup"
                                TabStripPlacement="Top">
                <telerik:RadPane x:Name="ServerDetails"
                                    Header="Server Details"
                                    CanUserClose="False">
                    <TextBlock Text="Server Details Panel"/>
                </telerik:RadPane>
                <telerik:RadPane x:Name="ServerData"
                                    Header="Server Data"
                                    CanUserClose="False">
                    <TextBlock Text="Server Data Panel"/>
                </telerik:RadPane>
                <telerik:RadPane x:Name="ServerHistory"
                                    Header="Server History"
                                    CanUserClose="False">
                    <TextBlock Text="Server History Panel"/>
                </telerik:RadPane>
            </telerik:RadPaneGroup>
        </telerik:RadSplitContainer>
    </Grid>
</UserControl>

And code behind

using Microsoft.Webstore.Console.SiteMetadataProxy;
using Microsoft.Webstore.Console.ViewModels;
using Telerik.Windows.Controls;

namespace Microsoft.Webstore.Console
{
    public partial class MainPage
    {
        public MainPage()
        {
            InitializeComponent();
        }

        private void ClusterLoadOnDemand(object sender, Telerik.Windows.RadRoutedEventArgs e)
        {
            var item = e.OriginalSource as RadTreeViewItem;
            if (item == null)
            {
                return;
            }
            var viewModel = Resources["ClusterViewModel"] as ClusterViewModel;
            if (viewModel == null)
            {
                item.IsLoadOnDemandEnabled = false;
                return;
            }
            if (item.Header.Equals("Clusters"))
            {
                viewModel.GetClusters();
                item.IsLoadingOnDemand = false;
                return;
            }
            var cluster = item.Item as Cluster;
            if (cluster == null)
            {
                item.IsLoadOnDemandEnabled = false;
                return;
            }
            viewModel.GetServersData(cluster);
        }

        private void ClusterTreeItemPrepared(object sender, RadTreeViewItemPreparedEventArgs e)
        {
            RadTreeViewItem item = e.PreparedItem;
            if (item.Item is DataServer)
            {
                item.IsLoadOnDemandEnabled = false;
            }
        }
    }
}

And the problem is that after first dbl-click on Cluster node (root node in my tree view), LoadOnDemand is called, it gets the data and sets the Clusters property on my ModelView, but the node does not expand. After a second dbl-click - it does expand and shows all Cluster. I want it to expand after the first dbl-click. In the future I am planning to add more 'root nodes' which will expand their data.

I am OK with expanding the node programmatically (if it is really necessary) - but I do not know how. Setting IsExpanded property on root node gives me StackOverflow, and it recursively calls LoadOnDemand.

Also if you have any example of RadTreeView bound to data coming from async WCF service call (not RIA) - that would save me lots of time.

Thanks again.

[Petar Mladenov]

Hello Jacek Dudziak,

In this help article is demonstrated the best practice when using the LoadOnDemand Feature of the RadTreeView via WCF Data Service and asynchronous calls. In it there is a link to the standard Northwind database. The things that are not explained in detail could be found in this msdn article(Getting Started with WCF Data Services). Could you please give  it a try and let us know if this approach fits in your case? Of course, if you find any difficulties in realizing it, do not hesitate to ask.

All the best,
Petar Mladenov
the Telerik team