Last Updated: 05 Dec 2021 09:40 by ADMIN
Release 2.24.0
Created on: 19 Apr 2021 19:26
Category: ComboBox
Type: Bug Report
Value binding in ComboBox doesn't work as expected in Blazor form, the pre-selected value is not displayed accordingly

Issue - Setting the selected element of a combo box inside a form worked in 2.22.0 and no longer works in 2.23.0 

Repo -

Steps to Reproduce 

  • In the test repo start the application and navigate to https://localhost:5001/updateWeather
  • The selected value in the combo box should be the 8th value, "summary 8"
  • Stop the application, in BlazorGrid.Client.csproj 
    • Replace <PackageReference Include="Telerik.UI.for.Blazor" Version="2.22.0" />
    • With <PackageReference Include="Telerik.UI.for.Blazor" Version="2.23.0" />
  • Do a clean/rebuild to ensure the latest version of Telerik Blazor is being used
  • Run the application in a new incognito window and navigate back to https://localhost:5001/updateWeather, notice how nothing is selected in the combo box



This is a contrived example pulled out of a larger application.  Almost all of our combo boxes are backed by OData calls.  When we 'create or POST' an element the first time we load the form we have the combo box make an OData call to retrieve the top 200 elements.  On a subsequent 'edit or PUT', where we have a thing we want to update we first go get the thing we want to work with, and then fill in the comobo box with that element.

In this example application we simulate this load by deciding if a value was passed in or not for the combo box.  https://localhost:5001/updateWeather always passes in an 8 to load the 8th element.  https://localhost:5001/createWeather does not pass in any value, leaving the form value unbound.

This all worked as expected in 2.22.0, however once we upgraded to 2.23.0 we could no longer set the value of the combo box on load when combined with an OData call.

Marin Bratanov
Posted on: 05 Dec 2021 09:40

Hi Robert,

If the hint from my comment here does not help you move forward, I'd suggest opening a ticket with a runnable sample that shows the Telerik issue.

Marin Bratanov
Progress Telerik

Learn about the important changes coming in UI for Blazor 3.0 in January 2022!
Posted on: 03 Dec 2021 06:55

I am experiencing this problem with version 2.29 when the drop-down list is in a "component"

It seems to be intermittent but dependent on how long the async method takes to complete.

 Edit page

@page "/"
@using System.Diagnostics
@using System.Threading
@using BlazorApp1.Components

<h1>Hello, world!</h1>

<EditForm class="form-inline" Model="@Model">
    <MyComponent />

Welcome to your new app.

@code {
    object Model = new();
    private Guid InstanceId;

    public Index()
        InstanceId = Guid.NewGuid();
        Debug.WriteLine($"Index - {InstanceId}");

    protected override Task OnInitializedAsync()
        Debug.WriteLine("Index - OnInitializedAsync");
        return base.OnInitializedAsync();

    protected override Task OnParametersSetAsync()
        Debug.WriteLine("Index - OnParametersSetAsync");
        return base.OnParametersSetAsync();



@using System.Diagnostics <h3>My Component</h3><br /><TelerikDropDownList @bind-Value=_selectedValue Data="@myComboData" TextField="MyTextField" ValueField="MyValueField" TValue="int" TItem="MyDdlModel"></TelerikDropDownList><br /><TelerikButton OnClick="@SayHelloHandler" Primary="true">Say Hello</TelerikButton><br /> @helloString <br /> @code { private Guid InstanceId; MarkupString helloString; int _selectedValue { get; set; } = 2; // Preselected value IEnumerable<MyDdlModel> myComboData { get; set; } = Enumerable.Empty<MyDdlModel>(); void SayHelloHandler() { string msg = string.Format("Hello from <strong>Telerik Blazor</strong> at {0}.<br /> Now you can use C# to write front-end!", DateTime.Now); helloString = new MarkupString(msg); } public MyComponent() { InstanceId = Guid.NewGuid(); Debug.WriteLine($"MyComponent - {InstanceId}"); } protected override async Task OnInitializedAsync() { Debug.WriteLine("MyComponent - OnInitializedAsync"); myComboData = await LoadData(); await base.OnInitializedAsync(); } protected override Task OnParametersSetAsync() { Debug.WriteLine("MyComponent - OnParametersSetAsync"); return base.OnParametersSetAsync(); } private async Task<IEnumerable<MyDdlModel>> LoadData() { await Task.Delay(100); return Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x }); } public class MyDdlModel { public int MyValueField { get; set; } public string MyTextField { get; set; } } }


Hristian Stefanov
Posted on: 20 Apr 2021 14:13

Hello Ben,

Indeed after the upgrade (to 2.23.0), the value of the ComboBox in the form can no longer be set on the component initialize. Thank you for noticing and reporting!

By the way, I touched a little bit on the title of the requested bug for more clarity. I have already added your vote there because, this way, the priority of the requested bug is increased, and we are tracking this interest.

The bug fix is scheduled for the next release (2.24.0). Around mid-May. As a small thank you gesture, I've added some Telerik points to your account.

Hristian Stefanov
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.