New to Telerik UI for Blazor? Download free 30-day trial

The Window Does Not Display Its Child Items Data


Product Window for Blazor


If you have a component, such as DropDownList, nested within a Telerik Window, you may see a situation where the DropDownList items appear blank. The Window does not display its child component data in scenarios like this.


The reason for the issue is that the child component receives its data after the Window becomes visible.


Refresh the Window through its Refresh() method—this will update the component's UI, and the data will appear.

This example demonstrates the usage of the Window's Refresh() method, ensuring the display of child items' data.

DropDownList inside a Window

<TelerikWindow @ref="@WindowRef" @bind-Visible="@WindowIsVisible">
        Window Title
        <TelerikDropDownList Data="@myDdlData" TextField="MyTextField" ValueField="MyValueField" @bind-Value="@selectedValue">
        <WindowAction Name="Close" />

<TelerikButton OnClick="@( () => WindowIsVisible = !WindowIsVisible )">Toggle window</TelerikButton>

@code {
    TelerikWindow WindowRef;
    bool WindowIsVisible { get; set; } = true;

    IEnumerable<MyDdlModel> myDdlData { get; set; }
    int selectedValue { get; set; } = 3;

    //This simulates receiving the data after the Window becomes visible.
    protected override async Task OnAfterRenderAsync(bool firstRender)
        if (firstRender)
            await Task.Delay(1500);

            await LoadData();

            WindowRef.Refresh(); //This line refreshes the Window instance.

    public class MyDdlModel
        public int MyValueField { get; set; }
        public string MyTextField { get; set; }

    async Task LoadData()
        myDdlData = Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x });
In this article