I would like that in my dropdown at the beginning no value is entered. only if I select the value it should be displayed in the dropdown. if I comment out "value: _selected" is not filled but after the onChanged also nothing is filled.

FormField<Device>(
                  initialValue: _selected,
                  builder: (field) {
                    return InputDecorator(
                      decoration: InputDecoration(
                        labelText: widget.labelText,
                        border: const OutlineInputBorder(),
                      ),
                      child: DropdownButtonHideUnderline(
                        child: DropdownButton<Device>(
                          value: _selected,
                          isDense: true,
                          isExpanded: true,
                          items: widget.list
                              .map<DropdownMenuItem<Device>>((Device value) {
                            return DropdownMenuItem<Device>(
                              value: value,
                              child:
                                  Text('${value.inventarnr} - ID: ${value.id}'),
                            );
                          }).toList(),
                          onChanged: (value) {
                            setState(() {
                              _selected = value;
                            });
                          },
                        ),
                      ),
                    );
                  },
                ),

CodePudding user response：

Below worked example for your reference.

initializing default dropdown value

String phaseInitialValue = "Select dropdown";

declare a class to get the user selected value from dropdown. I have using temporary json data...

List<Phase> phaseList = phaseJsonList.phaseList;
  Phase phase = Phase("","");

FormField full code :

FormField(
          initialValue: phaseInitialValue,
          builder: (field) {
            return InputDecorator(
              decoration: const InputDecoration(
                labelText: "Dropdown",
                border: OutlineInputBorder(),
              ),
              child: DropdownButtonHideUnderline(
                child: DropdownButton(
                  hint: Text(
                    phaseInitialValue,
                    style: const TextStyle(
                        fontWeight: FontWeight.w400,
                        color: Color.fromRGBO(179, 179, 179, 1.0),
                        fontSize: 15.0,
                        fontStyle: FontStyle.normal
                    ),
                  ),
                  isExpanded: true,
                  iconSize: 30.0,
                  iconEnabledColor:
                  const Color.fromRGBO(0, 0, 0, 1.0),
                  style: const TextStyle(
                      color: Color.fromRGBO(0, 0, 0, 1)),
                  dropdownColor:
                  const Color.fromRGBO(255, 255, 255, 1.0),
                  borderRadius: BorderRadius.circular(5),
                  items: phaseList.map(
                        (phaseData) {
                      return DropdownMenuItem<Phase>(
                        value: phaseData,
                        child: Text(phaseData.phaseName),
                      );
                    },
                  ).toList(),
                  onChanged: (Phase? newData) {
                    setState(() {
                      phase = newData!;
                      phaseInitialValue = newData.phaseName!;
                      },
                    );
                  },
                ),
              ),
            );
          },
        ),

if user changed the value from dropdown i have retrieve that from onChanged property. there i changed inital text to user selected object...

you can able to fetch actual id as well as object...

have a good day!!!