Question 228515 in Flutter Question posted in
The official Flutter documentation can be found here.

how to create search screen with multiple selection in flutter?

I am creating search screen where i have used chip collection for selecting country,
sports

where

country chips are=[‘England’,’India’,’Switzerland’,’Norway’,’U.S’,’Germany’];
and
sports chips are=[‘FootBall’,’Chess’,’Tennis’,’Cricket’];

and after selecting chips i want to creat a result list name filteredList to show selected data;

further i will add textfield for searching among this selected data

List<Player> getData()
  {

    List<Player> players=[
      Player(name: 'David',  sport: 'FootBall',country: 'England'),
      Player(name: 'Anand',  sport: 'Chess',country: 'India'),
      Player(name: 'Martina', sport: 'Tennis',country: 'Switzerland'),
      Player(name: 'Kohli',  sport: 'Cricket',country: 'India'),
      Player(name: 'Carlsen', sport: 'Chess',country: 'Norway'),
      Player(name: 'Gerrard', sport: 'Football',country: 'England'),
      Player(name: 'Agasi',  sport: 'Tennis',country: 'U.S'),
      Player(name: 'S Graph', sport: 'Tennis',country: 'Germany'),
    ];

    List<String> _selectedCountries=['England','India'];
    List<String> _selectedSports=['FootBall','Chess','Tennis'];
    
    List<Player> filteredList=[];
    //here i want code for filtering records 
    //if selectedSports and selectedCountries are null...result should be null
    //as per following selection result should b 3 records 
    //Player(name: 'David',  sport: 'FootBall',country: 'England'),
    //Player(name: 'Anand',  sport: 'Chess',country: 'India'),
    //Player(name: 'Gerrard', sport: 'Football',country: 'England'),
    
    return filteredList;
  }
Tags:

2

Answers


  1. 0

    You can filter the list like this:

    List<Player> filteredList = players.where(
    (player) {
      return selectedCountries.contains(player.country) &&
          selectedSports.contains(player.sport);
    },
  ).toList();

    For the "search screen" you should take a look at the FilterChip widget example.

    Login or Signup to reply.
  2. 0 
    List<Player> getData()
  {

    List<Player> players=[
      Player(name: 'David',  sport: 'FootBall',country: 'England'),
      Player(name: 'Anand',  sport: 'Chess',country: 'India'),
      Player(name: 'Martina', sport: 'Tennis',country: 'Switzerland'),
      Player(name: 'Kohli',  sport: 'Cricket',country: 'India'),
      Player(name: 'Carlsen', sport: 'Chess',country: 'Norway'),
      Player(name: 'Gerrard', sport: 'Football',country: 'England'),
      Player(name: 'Agasi',  sport: 'Tennis',country: 'U.S'),
      Player(name: 'S Graph', sport: 'Tennis',country: 'Germany'),
    ];

    List<String> _selectedCountries=['England','India'];
    List<String> _selectedSports=['FootBall','Chess','Tennis'];
    
    List<Player> filteredList=[];

if(_selectedSports.isNotEmpty)
  filteredList=players.where((element) => _selectedSports.contains(element.sport)).toList();

 
  if(_selectedCountries.isNotEmpty)
  filteredList=filteredList.where((element) => _selectedCountries.contains(element.country)).toList();

  

  if(_selectedSports.isEmpty && _selectedCountries.isEmpty)
    filteredList=[];

  print(filteredList.length);
   
    
    return filteredList;
  }
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search