Intersoft ClientUI Documentation
How-to: Enable Load On Demand Behavior In UXTreeList

This example shows how enable load on demand behavior in UXTreeList.

Example

Description

To enable load-on-demand, you set the IsLoadOnDemand property of the control to true, and set the ExpandedItem and ProcessedItem properties to appropriate binding in your View Model.

The ExpandedItem property allows you to interact with the entity being expanded and write your own logic to retrieve the child items in the ViewModel. Once the child items become available, you assign the original entity to the ProcessedItem property to notify the control that the loading process is completed.

The following code shows how to enable load on demand in UXTreeList and perform the load child operation using MVVM pattern.

Code

C#
Copy Code
using System.Collections;
using System.Collections.ObjectModel;
using System.Linq;
using ClientUI._2012R1.Preview.ModelServices;
using ClientUI._2012R1.Preview.Web;
using Intersoft.Client.Data.ComponentModel;

namespace ClientUI._2012R1.Preview.ViewModels
{
    public class LoadOnDemandViewModel : GridViewModelBase<Employee>
    {
        #region Constructors

        public LoadOnDemandViewModel()
        {
            this.QueryDescriptor.SuspendQueryChanged = true;
            this.QueryDescriptor.FilterDescriptors.Add(new FilterDescriptor() { PropertyName = "ReportsTo", Operator = FilterOperator.IsEqualTo, Value = null });
            this.QueryDescriptor.SuspendQueryChanged = false;

            this.LoadData();
        }

        #endregion

        #region Data Source

        private IDataRepository _dataSource;

        protected override IDataRepository DataSource
        {
            get
            {
                if (_dataSource == null)
                    _dataSource = new EmployeesRepository(RepositoryManager.Create());

                return _dataSource;
            }
        }

        #endregion

        #region Fields

        private object _expandedItem;
        private object _processedItem;

        #endregion

        #region Properties

        public object ExpandedItem
        {
            get { return _expandedItem; }
            set
            {
                if (_expandedItem != value)
                {
                    _expandedItem = value;
                    this.OnPropertyChanged("ExpandedItem");
                    this.LoadChildData(value as Employee);
                }
            }
        }

        public object ProcessedItem
        {
            get { return _processedItem; }
            set
            {
                if (_processedItem != value)
                {
                    _processedItem = value;
                    this.OnPropertyChanged("ProcessedItem");
                }
            }
        }

        #endregion

        #region Methods
        
        protected override void InitializeItems(IEnumerable items)
        {
            this.Items = new HierarchicalCollectionView(new ObservableCollection<Employee>(items.Cast<Employee>())); ;
        }

        private void LoadChildData(Employee employee)
        {
            if (employee != null)
            {
                Intersoft.Client.Data.ComponentModel.QueryDescriptor queryDescriptor = new Intersoft.Client.Data.ComponentModel.QueryDescriptor();
                queryDescriptor.FilterDescriptors.Add(new FilterDescriptor() { PropertyName = "ReportsTo", Operator = FilterOperator.IsEqualTo, Value = employee.EmployeeID });
                this.DataSource.GetData
                (
                    queryDescriptor,
                    (items) =>
                    {
                        this.ProcessedItem = employee;

                        HierarchicalCollectionView view = this.Items as HierarchicalCollectionView;
                        view.AddItems(items);
                    },
                    (totalItemCount) =>
                    {

                    },
                    (error) =>
                    {
                        this.Presenter.ShowErrorMessage(
                            "An exception has occurred during data loading.\n" +
                            "Message: " + error.Message + "\n" +
                            "Stack Trace: " + error.StackTrace);
                    }
                );
            }
        }

        #endregion
    }
}
XAML
Copy Code
<Intersoft:UXPage 
    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"
    mc:Ignorable="d"
    xmlns:Intersoft="http://intersoft.clientui.com/schemas"
    xmlns:ViewModels="clr-namespace:ClientUI._2012R1.Preview.ViewModels"
    x:Class="ClientUI._2012R1.Preview.Views.UXTreeList.LoadOnDemand" 
    Title="LoadOnDemand Page"
    d:DesignWidth="640" d:DesignHeight="480">

    <Intersoft:UXPage.DataContext>
        <ViewModels:LoadOnDemandViewModel/>
    </Intersoft:UXPage.DataContext>
    <Grid x:Name="LayoutRoot">
        <Intersoft:UXTreeList IsLoadOnDemand="True" ExpandedItem="{Binding ExpandedItem, Mode=TwoWay}" ProcessedItem="{Binding ProcessedItem, Mode=TwoWay}"
                              ItemsSource="{Binding Items}" IDBinding="{Binding EmployeeID}" ParentIDBinding="{Binding ReportsTo}"
                              AutoGenerateColumns="False" IsBusy="{Binding IsBusy, Mode=TwoWay}">
            <Intersoft:UXTreeList.Columns>
                <Intersoft:UXTreeListTreeColumn Header="Employee ID" Binding="{Binding Address}"/>
                <Intersoft:UXGridViewTextColumn Header="First Name" Binding="{Binding FirstName}"/>
                <Intersoft:UXGridViewTextColumn Header="Last Name" Binding="{Binding LastName}"/>
                <Intersoft:UXGridViewTextColumn Header="Address" Binding="{Binding Address}"/>
                <Intersoft:UXGridViewTextColumn Header="Home Phone" Binding="{Binding HomePhone}"/>
            </Intersoft:UXTreeList.Columns>

        </Intersoft:UXTreeList>
    </Grid>
</Intersoft:UXPage>