Show Default Text only before an item is selected

Environment

Product

DropDownList for Blazor

Description

I want the DropDownList to show the default text only when no option is selected. E.g. once the user selects a value, they are not allowed to select 'null' again.

Solution

You can modify the default text to be shown only before an item is selected by toggling the DefaultText parameter value depending on your business logic. The example below demonstrates how to achieve that.

@* Show the default text only when no option is selected *@

Selected value: @selectedValue
<br />

<TelerikDropDownList Data="@myDdlData" TextField="MyTextField" ValueField="MyValueField" @bind-Value="selectedValue"
                     DefaultText="@( selectedValue == 0 ? "Please Select" : null )">
</TelerikDropDownList>

@code {

    int selectedValue { get; set; }

    IEnumerable<MyDdlModel> myDdlData = 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; }
    }
}