Flutter DropDownButton not displaying Selected Value

Question

I am currently working on a Flutter App for grocery scanning and organization. I need this drop down button to select where the grocery item is being stored: shelf, fridge, or freezer. This is the code for my function which controls the drop down button. Keep in mind that this is inside of "class MyAppState extends ChangeNotifier", and I cannot use setState here.

Product addDateAndQuantityAndStorage(BuildContext context, Product product) {
TextEditingController dateInput = TextEditingController();
int selectedValue = 0;

showDialog<String>(
  context: context,
  builder: (BuildContext context) => AlertDialog(
    title: const Text("Add Expiration Date and Quantity"),
    content: Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        TextField(
          controller: dateInput,
          decoration: const InputDecoration(hintText: "Expiration Date"),
          onTap: () async {
            DateTime? pickedDate = await showDatePicker(
              context: context, initialDate: DateTime.now(),
              firstDate: DateTime(DateTime.now().year - 2),
              lastDate: DateTime(DateTime.now().year + 5),
            );

            if (pickedDate != null) {
              product.properties.expr = DateFormat('yy-MM-dd').format(pickedDate);
              dateInput.text = DateFormat('yy-MM-dd').format(pickedDate);
              notifyListeners();
            }
          }
        ),
        TextField(
          decoration: const InputDecoration(hintText: "Quantity"),
          keyboardType: TextInputType.number,
          onChanged: (value) {
            product.total = int.parse(value);
            notifyListeners();
          }
        ),
        DropdownButton(
          isExpanded: true,
          value: selectedValue,
          hint: const Text("Storage"),
          items: [
            DropdownMenuItem(
              value: 0,
              child: Text("Shelf"),
              onTap: () {
                selectedValue = 0;
                notifyListeners();
              },
            ),
            DropdownMenuItem(
              value: 1,
              child: Text("Fridge"),
              onTap: () {
                selectedValue = 1;
                notifyListeners();
              },
            ),
            DropdownMenuItem(
              value: 2,
              child: Text("Freezer"),
              onTap: () {
                selectedValue = 2;
                notifyListeners();
              },
            ),
          ],
          onChanged: (value) {
            switch(value) {
              case 0:
                product.storage = "Shelf";
                break;
              case 1:
                product.storage = "Fridge";
                break;
              case 2:
                product.storage = "Freezer";
                break;
            }
            notifyListeners();
          },
        ),
      ]
    ),
    actions: <Widget>[
      TextButton(
        onPressed: () {
          Navigator.pop(context, "Add");
        },
        child: const Text('Add'),
      ),
    ],
  ),
);
return product;
}

Answer 1

Need to rebuild Dialog it required to wrap with StatefulBuilder. Here you can find more info about it.

For example:

await showDialog<void>(
  context: context,
  builder: (BuildContext context) {
    int? selectedRadio = 0;
    return AlertDialog(
      content: StatefulBuilder(
        builder: (BuildContext context, StateSetter setState) {
          return Column(
            mainAxisSize: MainAxisSize.min,
            children: List<Widget>.generate(4, (int index) {
              return Radio<int>(
                value: index,
                groupValue: selectedRadio,
                onChanged: (int? value) {
                  setState(() => selectedRadio = value);
                },
              );
            }),
          );
        },
      ),
    );
  },
);