My first dropdown displays a list of cities that already exists. The second, depending on the value of the first, must display a list of sites which must be retrieved from the sqlite database.

City? city;
Site? site;

String? citySelectedValue = "";
String? siteSelectedValue = "";

final List<String> cityOptionsList = ["","firstElement","secondElement",...];

//First DropdownButtonFormField:

DropdownButtonFormField<String>(
    value: citySelectedValue,
    onChanged: (String? newValue)  async {
         city = await dbHelper.getCitiesFromName(newValue);
         siteList = await dbHelper.getCitySites(city!.id);//return list of sites
         setState(() {
              citySelectedValue = newValue!;
              optList = siteOptionList(siteList);//return list of string});
         },
    items: cityOptionsList.map<DropdownMenuItem<String>>((String value) { 
          return DropdownMenuItem<String>(
                 value: value,
                 child: Text(value),
             );
         }).toList(),
)

Here is the function code of siteOptionList function called in when the first DropdownButtonFormField value changes:

List<String> siteOptionList(List<Site>? sites){
    final List<String> myList = [""];
    if(sites==null){return [""];}else{
      for(var i=0;i<sites.length;i++){
        myList.insert(i+1,sites[i].libelle_site);
      }
      return myList;
    }
  }

This function returns me a list; but my second DropdownButton is still empty, it doesn’t display anything on my screen.

//Second DropdownButton

DropdownButtonFormField<String>(// Use null if no options are available
      hint: Text('Selectionnez un site'),
      onChanged: (String? newValue) {
      citySelectedValue = null;
      setState(() {
           siteSelectedValue = newValue;});
      },
      items: optList.map((String value) {
           return DropdownMenuItem<String>(
                value: value,
                child: Text(value),);
                }).toList(),
)