Dependent dropdown not working properly, flutter

Question

I am currently working on a project, where i have to use multiple level dropdown, once i have already coded that, the problem that arises is whenever i select the state, i have to select it two or more times to get it listed on the screen for user to select, API response is fine, and i can see the print data in terminal as soon as i select a state, i can see correspondent cities.

Please help me fix this. Thanks!!

Future getCities() async {
      var result;
      String encodedPath = "api/pincode/district?district=$selectedState";
      if (devMode == "development") {
        result = await http.get(Uri.parse('$devUrl$encodedPath'));
      } else {
        result = await http.get(Uri.parse('$prodUrl$encodedPath'));
      }
      var jsonData = json.decode(result.body);
      cityData = jsonData;
      print(cityData);
      return jsonData;
    }


FormBuilderDropdown(
                name: "Lead Source select",
                hint: Text("Select State"),
                items: statesData.map((list) {
                  return DropdownMenuItem(
                    child: Text(list['statename']),
                    value: list['statename'].toString(),
                  );
                }).toList(),
                onChanged: (val) {
                  selectedState = val.toString();
                  getCities();
                },
                valueTransformer: (val) => val?.toString(),
                decoration: InputDecoration(),
              ), //Select State
              FormBuilderDropdown(
                name: "Lead Source select",
                hint: Text("Select City"),
                items: cityData.map((list) {
                  return DropdownMenuItem(
                    child: Text(list['Districtname']),
                    value: list['Districtname'].toString(),
                  );
                }).toList(),
                onChanged: (val) {
                  selectedCity = val.toString();
                  statesData.clear();
                  setState(() {
                    getTehsil();
                  });
                },
                valueTransformer: (val) => val?.toString(),
                decoration: InputDecoration(),
              ), //Select City

This is inside build

States are being called inside initstate, when the page loads.

Future getStates() async {
    var result;
    String encodedPath = "api/pincode/allstates";
    if (devMode == "development") {
      result = await http.get(Uri.parse('$devUrl$encodedPath'));
    } else {
      result = await http.get(Uri.parse('$prodUrl$encodedPath'));
    }
    var jsonData = json.decode(result.body);
    statesData = jsonData;
    return jsonData;
  }