Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter: Selected value in dropdown list

The initial value in the dialog box doesn't change when I select an item. Here is the code for the dropdown list:

void _buildStatusDialog(String documentID) {
String _selectedText = "SDD";
showDialog<void>(
    context: context,
    builder: (BuildContext context) {
      return AlertDialog(
        title: Text("Status Update"),
        content: new DropdownButton<String>(
          hint: Text("Status"),
          value: _selectedText,
          items: <String>['SDD', 'Meeting', 'Home', 'Space']
              .map((String value) {
            return new DropdownMenuItem<String>(
              value: value,
              child: new Text(value),
            );
          }).toList(),
          onChanged: (String val) {
            _selectedText = val;
            setState(() {
              _selectedText = val;
            });
          },
        ),
        actions: <Widget>[
          FlatButton(
            child: Text("UPDATE"),
            onPressed: () {
              .....
            },
          ),
        ],
      );
    });

}

How do I update the "hint" or display the selected item?

enter image description here

like image 889
nypogi Avatar asked Jul 24 '18 03:07

nypogi


2 Answers

Using @Jonah Williams's tip in the comments I came up with the following working example to a similar problem that I had:

import 'package:flutter/material.dart';

class StatusDialog extends StatefulWidget {

  @override
  State<StatefulWidget> createState() {
    return StatusDialogState();
  }
}

class StatusDialogState extends State<StatusDialog> {
  String _selectedText = "SSD";

  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Text("Status Update"),
      content: new DropdownButton<String>(
        hint: Text("Status"),
        value: _selectedText,
        items: <String>['SDD', 'Meeting', 'Home', 'Space']
            .map((String value) {
          return new DropdownMenuItem<String>(
            value: value,
            child: new Text(value),
          );
        }).toList(),
        onChanged: (String val) {
          setState(() {
            _selectedText = val;
          });
        },
      ),
      actions: <Widget>[
        FlatButton(
          child: Text("UPDATE"),
          onPressed: () {
            //.....
          },
        ),
      ],
    );
  }
}

void _buildStatusDialog(String documentID) {
  showDialog<void>(
    context: context,
    builder: (BuildContext context) {
      return StatusDialog();
    }
  );
}

Then you just need to add some logic to obtain _selectedText from StatusDialog - probably using a callback.

like image 175
AXE Avatar answered Sep 17 '22 16:09

AXE


add this line isExpanded: true, it will expand the arrow to the right of the container so the code will be like this:

return new DropdownMenuItem<String>(
  value: value,
  child: new Text(value),
  isExpanded: true,
);
like image 26
Rami Ahmed Sadek Avatar answered Sep 19 '22 16:09

Rami Ahmed Sadek