In Development
Last Updated: 20 Feb 2026 14:43 by ADMIN
Scheduled for 2026 Q2
Chris
Created on: 20 Feb 2026 11:50
Category: DropDownTree
Type: Bug Report
1
DropDownTree does not display selected value when data is loaded asynchronously

The DropDownTree does not show its selected value if the data is set asynchronously.

Possible workarounds include:

  • Set the DropDownTree Value after the Data is set.
  • Render the DropDownTree component conditionally after the Data is set.

Test page:

DropDownTreeValue1: @DropDownTreeValue1
<br />
DropDownTreeValue2: @DropDownTreeValue2

<br />

Bug:
<TelerikDropDownTree Data="@DropDownTreeData"
                     @bind-Value="@DropDownTreeValue1"
                     @bind-ExpandedItems="@DropDownTreeExpandedItems"
                     Width="300px">
</TelerikDropDownTree>

Workaround:
<TelerikDropDownTree Data="@DropDownTreeData"
                     @bind-Value="@DropDownTreeValue2"
                     @bind-ExpandedItems="@DropDownTreeExpandedItems"
                     Width="300px">
</TelerikDropDownTree>

@* Render DropDownTree after setting Data *@
@if (DropDownTreeData is not null)
{
    <span>Workaround:</span>
    <TelerikDropDownTree Data="@DropDownTreeData"
                        @bind-Value="@DropDownTreeValue1"
                        @bind-ExpandedItems="@DropDownTreeExpandedItems"
                        Width="300px">
    </TelerikDropDownTree>
}

@code {
    private List<TreeItem>? DropDownTreeData { get; set; }

    private int DropDownTreeValue1 { get; set; }
    private int DropDownTreeValue2 { get; set; }

    private IEnumerable<object> DropDownTreeExpandedItems { get; set; } = new List<TreeItem>();

    protected override async Task OnInitializedAsync()
    {
        DropDownTreeValue1 = 3;
        await Task.Delay(1000);
        DropDownTreeData = LoadFlatData();

        // Set DropDownTree Value after setting Data
        DropDownTreeValue2 = 3;

        DropDownTreeExpandedItems = DropDownTreeData.Where(x => x.ParentId is null && x.HasChildren);
    }

    private int TreeLevels { get; set; } = 3;
    private int RootItems { get; set; } = 2;
    private int ItemsPerLevel { get; set; } = 2;
    private int IdCounter { get; set; }

    private List<TreeItem> LoadFlatData()
    {
        List<TreeItem> items = new List<TreeItem>();

        PopulateChildren(items, null, 1);

        return items;
    }

    private void PopulateChildren(List<TreeItem> items, int? parentId, int level)
    {
        var itemCount = level == 1 ? RootItems : ItemsPerLevel;
        for (int i = 1; i <= itemCount; i++)
        {
            var itemId = ++IdCounter;
            items.Add(new TreeItem()
            {
                Id = itemId,
                ParentId = parentId,
                HasChildren = level < TreeLevels,
                Text = $"Level {level} Item {i} Id {itemId}",
                Value = itemId
            });

            if (level < TreeLevels)
            {
                PopulateChildren(items, itemId, level + 1);
            }
        }
    }

    public class TreeItem
    {
        public int Id { get; set; }
        public int? ParentId { get; set; }
        public bool HasChildren { get; set; }
        public string Text { get; set; } = string.Empty;
        public int Value { get; set; }
    }
}

0 comments