CODEWITHSUNDEEP
dartflutterdropdown
Nitneuq
Nitneuq

Reputation: 5022

How to prevent changes in a dropdown in Flutter?

I tried to ask the user, if he is sure to change the data after pressing on a dropdown menu.

Currently, I launch an alert dialog after onChanged. Asking the user "Are you sure to change data ?". If Yes , I save the data changes. If "No", I close the alert dialog.

But if user chooses "No", the data has been changed and I don't want to change the data... How can I stop the change? I have a complicated solution where I save all data change, and when the user presses NO, I load the last data save before "NO" but I found this to complicated. Are there any other, more simple solution ? Thank you

Here is my code : 

new DropdownButton<String>(
    onChanged: (String changedValue) {
        dialog(); //lanche dialog with choice of data modification
        data=changedValue;
        setState(() {
            data;
            });
        },
        value: data,
        items: <String>['data1', 'data2', 'data3','data4', 'data5']
             .map((String changedValue) {
                 return new DropdownMenuItem<String>(
                     value: changedValue,
                     child: new Text(changedValue),
                     );
             }).toList()),

Upvotes: 2

Views: 1388

Answers (2)

Akhil Jose
Akhil Jose

Reputation: 1

I know this is too late to answer this question since this question was asked almost 4 years back from now. But some one like me will come around this question I guess. Here is the answer for you guys.

We can just reset the value of a dropdown to its initial value by calling reset method on the key of the dropdown button's state key.

  1. Declare a global key for DropDownButton widget in the state class of your widget or screen
 final _dropDownKey = GlobalKey<FormFieldState>();

  1. Attach the key in the constructor of your dropdown button

  2. You can now call reset method from the current state of the dropdown key to reset the dropdown value to its initial value.

 _dropDownKey.currentState?.reset();

in my case when the user taps "NO" in the confirmation dialog, I have to set the old value in the dropdown. What I have done is I waited for the result from alert dialog by async/await (alert dialog returns a nullable bool). When the pop up is closed a boolean or null will be returned. I added a if statement to reset the dropdown value if alert dialog returns false or null (which means user tapped on "NO" button or user dismissed the dialog by tapping on the empty area).

Future<void> _showDropDownChangeConfirmAlert(BuildContext context, FBO? fbo){
...... 
final isChangeConfirmed = await AlertDialogUtils.showConfirmationDialog(
      context,
      title: title,
      content: content,
      onPrimaryActionPressed: () => widget.onFboSelected.call(fbo),
    );
    // If the user taps on No in the confirmation dialog
    // Below code resets the dropdown value to the old selected FBO
    if ((isChangeConfirmed ?? false) == false) {
      if (mounted) {
        _dropDownKey.currentState?.reset();
      }
    }
....
}

Ps: AlertDialogUtils is a class in my project. It won't works in your project. Copy the idea not the code :)

Upvotes: 0

westdabestdb
westdabestdb

Reputation: 4648

You should update the setState data value in your decision function. Check the following code.

new DropdownButton<String>(
  onChanged: (String changedValue) {
    _showDialog(changedValue); // I changed this.
  },
  value: data,
  items: <String>['data1', 'data2', 'data3', 'data4', 'data5']
    .map((String changedValue) {
      return new DropdownMenuItem<String>(
        value: changedValue,
        child: new Text(changedValue),
      );
}).toList()),




void _showDialog(selection) {
  showDialog(
    context: context,
    builder: (BuildContext context) {
      return AlertDialog(
        title: new Text("Alert Dialog title"),
        content: new Text("Alert Dialog body"),
        actions: <Widget>[
          new FlatButton(
            child: new Text("No"),
            onPressed: () {
              Navigator.of(context).pop();
            },
          ),
          new FlatButton(
            child: new Text("Yes"),
            onPressed: () {
              // this is where data value updates.
              setState(() {
                data = selection;
              });
              Navigator.of(context).pop();
            },
          ),
        ],
      );
    },
  );
}

Upvotes: 1

Related Questions