Possible to update/rebuild open DropdownButtonFormField? - flutter

Is it possible to uppdate or rebuild open DropdownButtonFormField, e.g. with GetIt or Provider - or perhaps by using a stream - when new data becomes available?
At the moment the options in the dropdown gett added as data arrives while the dropdown is un-expanded, but once the user taps on it only those items that were available at the time they tapped are available and new items are only available if and when the user closes and reopens the dropdown.
My user interface currently has
DropdownButtonFormField(
value: dropdownValue,
icon: const Icon(Icons.keyboard_arrow_down),
items: dropdownItems,
validator: (value) =>
(value == null || value == "0") ? 'Please select a recipient.' : null,
onChanged: (String? newValue) {
if (newValue != null) {
dropdownValue = newValue;
} else {
dropdownValue = "0";
}
setState(() {});
},
)
the dropdownItems comes from
List<DropdownMenuItem<String>>? get dropdownItems {
if (clientListicle.items.isEmpty) {
developer.log('go fetch', name: '_MessagePageState get dropdownItems');
fetchClients();
}
for (var element in clientListicle.items) {
DropdownMenuItem<String> potentialItem =
DropdownMenuItem(value: element.id.toString(), child: Text(element.title));
bool isHave = false;
for (var exstElement in menuItems) {
if (exstElement.value == element.id.toString()) {
isHave = true;
}
}
if (!isHave) {
menuItems.add(potentialItem);
setState(() {});
}
}
if (menuItems.length == 1) {
return null;
} else {
return menuItems;
}
}
clientListicle is a singleton that inherits from a class that extends ChangeNotifier, and is registered in GetIt.
I've had a quick look at the implementation of DropdownButtonFormField and FormField that it extends, thinking maybe one could add functionality to or override a build method or some such, but think maybe I'm missing something simpler/easier and am probably just a bit out of my depth here... :-)
Update, I've tried adding a final _formFieldKey = GlobalKey<FormFieldState>(); key to the dropdown widget thinking I might be able to use that from the getter to trigger a rebuild, but no luck yet.

Related

Flutter Textformfield search receives data but does not display other data

This is my search code. It works by typing id the codes to display the information.
onSearch(String text) async {
if (text.isNotEmpty) {
List<Item> itemList = [];
for (var item in items) {
if (item.custnum == text.toLowerCase().toUpperCase()) {
itemList.add(item);
}
}
setState(() {
searchitems.clear();
searchitems.addAll(itemList);
print('name : ${searchitems[0].name}');
// if (searchitems.isEmpty) {
// searchitems = [];
// print('searchitems : ${searchitems[0].address!.length}');
// print('searchitems : ${searchitems[0].address!}');
});
} else {
setState(() {
searchCus.clear();
searchitems.clear();
// searchitems.addAll(items);
print('searchitems : $searchitems');
});
}
}
This is my textformfield, it can find and display data. But what I will do is Getting a code from another page It's received and shows the code. But it doesn't show me the information. It has to delete and type at least 1 new password to show the information. Please help me i tried a lot.
TextFormField(
initialValue:
'${searchCus.isEmpty ? "" : searchCus[widget.indexCus].custnum}',
onChanged: onSearch,
decoration: InputDecoration(
labelText: 'custnum',
labelStyle: TextStyle(fontFamily: 'supermarket', fontSize: 14),
isDense: true,
),
),
The reason the initial value not do the search is that you search logic is only works when you type in the textfield, if your initial value come from class constructor you can call onSearch in initState like this:
#override
void initState() {
super.initState();
if(searchCus.isNotEmpty){
onSearch(searchCus[widget.indexCus].custnum);
}
}

How to access dropdownlist selected value in flutter and use it in another widget

This is my drop down list code
String dropdownValue = "a";
#override
Widget build(BuildContext context) {
return DropdownButton<String>(
value: dropdownValue
),
onChanged: (String? newValue) {
setState(() {
dropdownValue = newValue!;
});
},
items: <String>[
'a','b','c'
].map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
);
}
}
I want to use the selected value here
uploadDatatoFirebase() async {
*firebase connection code*
await FirebaseFirestore.instance
.collection(**selected value in drop down**) // the value from the box goes here
}
I can't seem to find a solution please help i want to create a database depending on the select box value any other techniques will also be welcomed
https://pub.dev/packages/get_it This is the package I use so I can can access a single instance of a class anywhere in the app, it is very popular and very well maintained. You could do this
setState(() {
dropdownValue = newValue!;
GetIt.I.get<ControllerWhatever>().selectedValueInDropDown = newValue!;
})
Just register the 'global controller instance' just as described in the get_it page and you will be able to get the value from any attribute you want anywhere in your app. It will make you life a lot easier

Change selection of dropdown button according to the choice from the previous one, Flutter

I have 2 DropdownButtonFormFields where I have a selection of cars. I need to change the second selection of buttons according to the car model user has chosen from the first selection in the DropdownButtonFormField (i.e. If a user chooses a Mercedes in the first one, in the DropdownButtonFormField below, I want to display only models of Mercedes and not, let's say, Audi).
How can I achieve this? Here is the code:
String _make, _model;
/// List of cars and models
List<String> carList = [
'Audi',
'BMW',
'Mercedes',
];
List<String> modelAudi = ['A6', 'A8', 'Q7',];
List<String> modelMercedes = ['E-Class', 'S-Class','Maybach'];
List<String> modelBMW = ['3-Series', 'X5', 'X7'];
/*two DropdownButtonFormFields, but the second one needs to match
it's car manufacturer selection from the carList selection
(i.e. if you select Audi, it must only show the modelAudi list (A6,
A8, Q7) in the second DropdownButtonFormField)
*/
DropdownButtonFormField<String>(
value: _make,
items: carList
.map((label) => DropdownMenuItem(
child: Text(label.toString()),
value: label,
))
.toList(),
onChanged: (value) {
setState(() {
_make = value;
print(value);
});
},
),
DropdownButtonFormField<String>(
value: _model,
/* here is where I need to implement logic
that maps out the model names that matches the car maker
*/
items: modelAudi
.map((label) => DropdownMenuItem(
child: Text(label.toString()),
value: label,
))
.toList(),
onChanged: (value) {
setState(() {
_model = value;
print(value);
});
},
),
The DropDown for the first button:
And naturally because I have no logic behind it, I get this as the model selection whatever I chose from the car list, but I want it to map out only models from the car list you chose.
This is a great use case for a switch statement. Define your cases for each car maker according to this example:
String _maker;
List chosenMakerModel;
switch (_maker) {
case 'Audi':
chosenMakerModel = modelAudi;
break;
case 'BMW':
// implement logic:
break;
case 'OTHER MANUFACTURER':
// implement logic;
break;
}
Using the example code above use chosenMakerModel instead of modelAudi
You can create a model selection method to handle this situation, like
List<String> _selectModel(String? modelName) {
return modelName == carList[0]
? modelAudi
: modelName == carList[1]
? modelMercedes
: modelBMW; // initally it will have modelBMW
}
This will decide the second dropdown item. If you click to select the second drop down item 1st, it will through errors. To handle this situation, you need to update the second dropdown value as well. You can set the second dropdown value=null. Therefor we need to use nullable String for selection value.
class MyProfileState extends State<StatefulWidget> {
String? _make, _model;
/// List of cars and models
List<String> carList = ['Audi', 'BMW', 'Mercedes'];
List<String> modelAudi = ['A6', 'A8', 'Q7'];
List<String> modelMercedes = ['E-Class', 'S-Class', 'Maybach'];
List<String> modelBMW = ['3-Series', 'X5', 'X7'];
List<String> _selectModel(String? modelName) {
return modelName == carList[0]
? modelAudi
: modelName == carList[1]
? modelMercedes
: modelBMW;
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
DropdownButtonFormField<String>(
value: _make,
items: carList
.map((label) => DropdownMenuItem(
child: Text(label.toString()),
value: label,
))
.toList(),
onChanged: (value) {
setState(() {
_make = value;
_model = null;
print(value);
});
},
),
DropdownButtonFormField<String>(
value: _model,
items: _selectModel(_make)
.map((label) => DropdownMenuItem(
child: Text(label.toString()),
value: label,
))
.toList(),
onChanged: (value) {
setState(() {
_model = value;
print(value);
});
},
),
],
));
}
}

How to implement search in PaginatedDataTable Flutter Web

Hi I have a PaginatedDataTable and right now I would like to make it searchable so when I type some keyword it would show the data according to the keyword that users type... I have been searching some articles about it, but I didn't find yet... anyone knows some tutorials or articles or examples about it?
dataList: _searchController.text == ""
? widget.dataList
: searchList,
actions: [
AnimatedSearchBar(
width: 300,
textController: _searchController,
onSuffixTap: () {
setState(() {
_searchController.text = "";
});
}),)]
they are PaginatedDataTable properties
#override
void initState() {
super.initState();
if (searchableItemList.length != 0 && widget.dataList.length != 0) {
_searchController.addListener(() {
setState(() {
searchList = dataList
.where((element) => element
.name
.toLowerCase()
.contains(controller.text.toLowerCase()))
.toList();;
});
});
}}

Flutter DropdownButtonFormField not showing selected item

Using DropdownButtonFormField element to show a lists of cities. It works fine on change event and show the selected item on change event. Issue is that once I try to show selected item from set state its not working. Although state is successfully set and working.
Here is my DropdownButtonFormField code:-
DropdownButtonFormField(
value: _city,
onChanged: (String newValue) {
setState(() {
_city = newValue;
});
},
// initialValue: 'Male',
items: ['Ajman','Al Ain','Dubai','Fujairah','Ras Al Khaimah', 'Sharjah', 'Ajman','Umm Al Quwain']
.map((cityTitle) => DropdownMenuItem(
value: cityTitle, child: Text("$cityTitle")))
.toList(),
)
I set _city in InitState
#override
void initState() {
setFilters();
super.initState();
}
setFilters(){
setState(() {
_city = "Dubai";
});
}
But it's not showing selected value. How can I fix that ?
Meanz when I want to set value of _city from initState its not working