How to reset a Value of DropdownButtonField inside OnChanged

124 Views Asked by At

I have a DropdownButtonFormField where the last item is a DropdownMenuItem to add a new Object using a Dialog.

Padding(
  padding: const EdgeInsets.only(bottom: 15),
  child: Observer(
    builder: (_){
      return DropdownButtonFormField(
        value: createdContentStore.subjectTitleSelected,
        isDense: true,
        decoration: InputDecoration(
            contentPadding: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
            isDense: true,
            border: OutlineInputBorder()
        ),
        onChanged: (value) async {
          // print(value);
          if(value == 'newSubject'){
            Subject newSubject = await showDialog(
                context: context,
                builder: (_) => CreatedSubjectDialogBox(isNewContent: true,)
            );
            if(newSubject != null){
              createdContentStore.setSubjectTitleSelected(newSubject.title);
              createdContentStore.setSubject(newSubject);
            } else {
              // WHAT CAN I DO HERE TO RESET DROP'S VALUE?
            }
          } else {
              createdContentStore.setSubjectTitleSelected(value);
          }
        },
        iconSize: 30,
        hint: Text('Selecione uma matéria'),
        items: subjectStore.subjectList.map((subject) => DropdownMenuItem(
          value: subject.title,
          child: Text(subject.title),
          onTap: () {
            createdContentStore.setSubject(subject);
          },
        )).toList()..add(DropdownMenuItem(
          value: 'newSubject',
          child: Center(
            child: Text(
              'Nova Matéria'.toUpperCase(),
              style: TextStyle(color: redRevise),
            ),
          ),
        )),
      );
    },
  ),
);

When the Dialog is shown the user can create a new Object that will appear in the Dropdown. When the user cancels the Dialog it is showing the last item. The desired behavior is to show the hint instead.

Can someone help me? Thank you!

1

There are 1 best solutions below

0
On BEST ANSWER

All you have to do is remove the value from the drop down,

 DropdownButtonFormField(
//** REMOVE THE VALUE **
        isDense: true,
        decoration: InputDecoration(
            contentPadding: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
            isDense: true,
            border: OutlineInputBorder()
        ),
        onChanged: (value) async {
          if(value == 'newSubject'){
            Subject newSubject = await showDialog(
                context: context,
                builder: (_) => CreatedSubjectDialogBox(isNewContent: true,)
            );
            if(newSubject != null){
              createdContentStore.setSubjectTitleSelected(newSubject.title);
              createdContentStore.setSubject(newSubject);
            } else {
              // WHAT CAN I DO HERE TO RESET DROP'S VALUE?
            }
          } else {
              createdContentStore.setSubjectTitleSelected(value);
          }
        },
        iconSize: 30,
        hint: Text('Selecione uma matéria'),
        items: subjectStore.subjectList.map((subject) => DropdownMenuItem(
          value: subject.title,
          child: Text(subject.title),
          onTap: () {
            createdContentStore.setSubject(subject);
          },
        )).toList()..add(DropdownMenuItem(
          value: 'newSubject',
          child: Center(
            child: Text(
              'Nova Matéria'.toUpperCase(),
              style: TextStyle(color: redRevise),
            ),
          ),
        )),
      );
    },
  ),
);