Search code examples
listviewflutterflutter-layoutflutter-dependenciesflutter-sliver

How to search data from list with checkbox in flutter


I want search from the list and also render data into that list with a checkbox. it means in this photo I've data already but when I click on the app bar search box and start searching data it will give me the result based on search data.

Here Is the full source code of project. https://github.com/rutvikgumasana/testing

This is the out of the code


Solution

  • I have implemented a local search for your data in the list. Check below code

    initliaise a global list object

    List<ServicesByCountry> finalList = new List();
    

    pass your searchQuery in constructor

    final BspServiceBloc _bspServiceBloc;
    final String searchQuery;
    final List<int> servicesIds;
    final Map<String, bool> selection;
    
      const BspServiceScreen({
        Key key,
        @required BspServiceBloc bspServiceBloc,
        @required this.servicesIds,
        @required this.selection,
        this.searchQuery,
      })  : _bspServiceBloc = bspServiceBloc,
            super(key: key);
    

    then use below code to search

    WidgetsBinding.instance.addPostFrameCallback((_) {
      if (widget.searchQuery != '') {
        finalList.clear();
        lovCountryServices.forEach((ServicesByCountry data) {
          if (data.name
              .toLowerCase()
              .contains(widget.searchQuery.toLowerCase())) {
            setState(() {
              finalList.add(data);
            });
          } else {
            data.services.forEach((Service services) {
              if (services.name
                  .toLowerCase()
                  .contains(widget.searchQuery.toLowerCase())) {
                setState(() {
                  finalList.add(data);
                });
              }
            });
          }
        });
      } else {
        setState(() {
          finalList.clear();
          finalList.addAll(lovCountryServices);
        });
      }
    });
    

    then pass the final list to your listView widget