<TelerikDropDownList Data="@myDdlData" TextField="MyTextField" ValueField="MyValueField" @bind-Value="@SelectedValue" Width="100%" />
public string SelectedValue { get; set; }
public class MyDdlModel
{
public int MyValueField { get; set; }
public string MyTextField { get; set; }
}
protected IEnumerable<MyDdlModel> myDdlData = Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x });
I want to add solution for doing the same with Enum value type. Let's say you have enum EnumValues = {Unknown, First, Second, Third} and the MyValueField is of type EnumValues. I want to show the First, Second and Third in the drop down but when the SelectedValue = Unknown I want the dropdown to show blank. Two ways to accomplish:
1. myDdlData will have items for the First, Second and Third but not for the Unknown. Set the DefaultText = " ". Note the single blank space. Setting the DefaultText = "" (empty string) doesn't change the selection.
2. myDdlData will have item for Unknown, First, Second and Third. The Unknown item will be: new MyDdlModel { MyTextField = "", MyValueField = EnumValues.Unknown };
Feel free to use my comment in documentation.
Hello,
Thank you for providing the code snippet. With it, I was able to reproduce and isolate the issue. Let me go over what I found below.
I found the issue is the data model bound to the DropDownList doesn't include a null value option. Assuming the SelectedValue is set to 0 on button click, then this needs to be in the myDdlData object. Since it doesn't exist the UI doesn't change.
To get this to work, either set a Default Value property or ensure the value exists in the data model. Let me go over these below.
The DropDownList component includes a DefaultText property and adding this to the component markup will enable clearing the selected value. See the following code snippet for a working example.
@page "/"
<TelerikDropDownList Data="@myDdlData" TextField="MyTextField" ValueField="MyValueField" @bind-Value="@SelectedValue" Width="30%" DefaultText="Select an Item" />
<TelerikButton OnClick="@SelectionChange">Clear Selection</TelerikButton>
@code {
public int SelectedValue { get; set; } = 0;
public class MyDdlModel
{
public int MyValueField { get; set; }
public string MyTextField { get; set; }
}
protected IEnumerable<MyDdlModel> myDdlData = Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x });
protected void SelectionChange()
{
SelectedValue = 0;
Console.WriteLine(SelectedValue);
}
}
This would work by adding a default item to the 0 value in the data source. The data used in the sample is for testing purposes and most model data would be backed by a database. In this case, during model construction it may be possible to add a default value 0 with custom text like, Select an Item.
The DefaultText with a missing/null ValueField is described in the Features Section on the Overview page and the Considerations Section on the Data Binding page of the documentation. For additional clarity, the introductory paragraphs in the Data Binding documentation has been updated as well.
Since this is already implemented, the status of the bug report will need to be changed to Declined. However, we do appreciate your feedback and welcome any that you may have.
Please let me know if you need any additional information. Thank you for being a valued UI for Blazor developer.
Regards,
Eric R | Senior Technical Support Engineer
Progress Telerik