Rebeca
Top achievements
Rank 1
Iron
Rank 1
Iron
<DropDownList
style={{ height: "30px" }}
defaultValue="Select unit..."
textField='name'
value={unitsPressureSelected}
dataItemKey='id'
onChange={(e) => {
console.log("here")
setUnitsPressureSelected(e.target.value);
}}
data={unitsPressure}
/>Hello! I'm trying to implement the following dropdown but the default value is not visible and I don't understand what's wrong. Could you give me a hint? Thanks!
Rebeca.
1 Answer, 1 is accepted
0
Rebeca
Top achievements
Rank 1
Iron
Rank 1
Iron
answered on 28 Apr 2022, 02:16 PM
I´ve changed it by a defaultItem instead that shows the following object and it´s working now:
const defaultItem = { name: "Select units ..." };
Konstantin Dikov
commented on 28 Apr 2022, 08:37 PM
Telerik team
Hello Rebeca,
Thank you for contacting us.
As you have found out, when the DropDownList is bound to a collection of objects (textField and dataItemKey), the defaultValue should also be an object. This is documented in the following help article:
The defaultItem property type has to match the data type. For example, if the data property contains a list of objects, the defaultItem has to be defined as an object with the same textField as the data items.
Please let us know if further questions arise.