title: How to Search data from api list in flutter searchable dropdown list
body: <p>i m in a situation where i have to implement country city state dropdown list somehow i manage things with normal flutter dropdown button and that's work ,but the issue is i can't search  data in that dropdown button so user have to scroll and find there country or city which is a very bad user experience , so i found this package <a href="https://pub.dev/packages/searchable_dropdown" rel="nofollow noreferrer">https://pub.dev/packages/searchable_dropdown</a> whic is working but i m not sure how to implement that search in my code here is my code
  data from fututre </p>
  
  <pre><code>    import 'package:flutter/material.dart';
  // import 'package:foodfromforeign1/models/country.dart';
  import 'dart:async';
  import 'package:http/http.dart' as http;
  import 'dart:convert';
  import 'package:flutter_typeahead/flutter_typeahead.dart';
  
  void main() =&gt; runApp( MyApp());
  
  
  
  class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return  MaterialApp(
        title: 'Flutter Demo',
        theme:  ThemeData(
          primarySwatch: Colors.red,
        ),
        home:  MyHomePage(title: 'Users'),
      );
    }
  }
  
  class MyHomePage extends StatefulWidget {
    MyHomePage({Key key, this.title}) : super(key: key);
  
    final String title;
  
    @override
    _MyHomePageState createState() =&gt;  _MyHomePageState();
  }
  
  class _MyHomePageState extends State&lt;MyHomePage&gt; {
   final String url = "http://10.0.2.2/fff/api/allcountries/";
   List data = List(); //line
  Future&lt;String&gt; getSWData() async {
      var res = await http .get(Uri.encodeFull(url), headers: {"Accept": "application/json"});
      var resBody = json.decode(res.body);
  
      setState(() {
        data = resBody.;
      });
  
      return "Sucess";
    }
  
      @override
    void initState() {
      this.getSWData();
      super.initState();
    }
  
  @override
    Widget build(BuildContext context) {
      return  Scaffold(
        appBar:  AppBar(
          title:  Text(widget.title),
        ),
        body:Container(
            padding: EdgeInsets.symmetric(horizontal: 20, vertical: 30),
          child:Column(
           children: &lt;Widget&gt;[
             TypeAheadField&lt;data&gt;(
        onSuggestionSelected: (data) =&gt; print('selected: ${data.name} ${data.id}'),
        suggestionsCallback: (s) =&gt; data.where((c) =&gt; c.name.toLowerCase().contains(s.toLowerCase())),
        itemBuilder: (ctx, data) =&gt; Text(data.name, textScaleFactor: 2,),
      )
           ],
  
          ),  
  
  
  
  
        ),
      );
  
    }
  }
  </code></pre>