I am trying to do a DropDownSearch in flutter, that is, a select field with a search for a form. For this I am using the dependency dropdown_search
The goal is to show me the "name" variable contained in a list of objects of the following class:
class Farmer
{
int? id;
String? createdAt;
String? updatedAt;
String name;
String city;
String email;
int phoneNumber;
String description;
Farmer({
this.id,
this.createdAt,
this.updatedAt,
required this.name,
required this.city,
required this.email,
required this.description,
required this.phoneNumber,
});
Map<String, dynamic> toMap(){
return{"id":id,
"createdAt":createdAt,
"updatedAt":updatedAt,
"name":name,
"city":city,
"email": email,
"phonenumber": phoneNumber,
"description":description};
}
Currently, I'm building on the following example from the documentation:
DropdownSearch<Farmer>(
popupProps: PopupProps.menu(
showSearchBox: true,
showSelectedItems: true,
disabledItemFn: (Farmer farmer) => farmer.name.startsWith("i"),
),
items: model.fvm.farmerList,
dropdownDecoratorProps: const DropDownDecoratorProps(
dropdownSearchDecoration: InputDecoration(
disabledBorder: InputBorder.none,
hintText: "dropdownCityName",
hintStyle: TextStyle(
color: Colors.black,
fontSize: 12,
),
),
),
onChanged: print,
selectedItem: (Farmer? farmer) => farmer.name,
itemAsString: (Farmer farmer) => farmer.name,
)
Where in the list "items" it would show the variable "name" that interests me, so far so good, since I have a type list from List<Farmer>
which I can generate another list with the names to pass them to "items". However, what I need is not to save the name, but the "id" field of the class in the database, and this is where I am already lost. Since I don't know how to capture that ID.
On the other hand, the "hinttext" is not displayed, I don't know why this happens either.
EDIT: Trying to implement the first proposed solution, I am having a very strange problem when generating the List with the Map, I leave the code:
Future<void> generateFarmerSelection() async
{
List<Farmer> farmerList = [];
setState(ViewState.Busy);
farmerList = (await fvm.getFarmersList())!;
setState(ViewState.Idle);
print(farmerList[0].name);
for (int i= 0;i<farmerList.length;i++)
{
Map<String,dynamic> farmer = {"name": farmerList[i].name,"id":farmerList[i].id};
farmers.add(farmer);
}
}
The line;
farmerList = (await fvm.getFarmersList())!;
it gives me an error like:
A value of type List<Farmer> can't be assigned to a variable of type List<Farmer>
Where the getFarmerList() function returns a List and is assigned to another List, so I don't see where the problem could be. On the other hand, the editor suggests me to do a:
(await fvm.getFarmersList()).cast<Farmer>();
But it doesn't work.
In another part of the code I have an assignment exactly the same and if it works for me in the following way:
(await fvm.getFarmersList())!
EDIT2: I managed to fix the problem in the following way:
var farmerList = (await fvm.getFarmersList());
For some reason you have to put type var
A simple solution would be to
onChanged
store the id of the selected option in the property in a variable created by itself, suppose that the variable created is the following:In the property
onChanged
you assign the value:An example taking into account your code would be this:
The only difference is that I use a list of maps and each map has its id.
//EDIT:
To fill in the
dropdownButtonSearch
necessary to implement the propertyselectedItem
for them we are going to create a class variable of typeMap<String, dynamic>
Suppose you have a function where you make the call to the database to fill in the form fields and be able to edit
This is how it would be filled
dropdownButtonSearch
and finally you assign the variable to the propertyselectedItem
:I am also working with the dropdownsearch widget. I leave you my method so you can see if it can be of help, I hope so. :)
First of all I will show you an example using the 'type_contract' data that I must fill in my form. I get the data from my apiRest as follows
in my file 'type_contract_service.dart'
The query response would be something like this:
I store all this inside a stream that is located in the same file as follows:
Thanks to this, now any new record that is made while I make my form can be reflected in the 'tipoContratoDopdownStream'. then I show it in my form as follows:
Finally, as can be seen above, in the OnChange() function, a for in of the data obtained is performed and by checking the selected one, the other data of the object can be manipulated as required.