CODEWITHSUNDEEP
flutter
Onalo Joseph
Onalo Joseph

Reputation: 265

How can i Filter a Json list in Flutter

i'm trying to create a dependable dropdown in flutter using json. I have this json list in my code

  List<Map> myJson = [
    {"id": 0, "continent": "Africa", "country":"Egypt"},
    {"id": 1, "continent": "Europe", "country":"Denmark"},
    {"id": 2, "continent": "Asia", "country":"India"},
    {"id": 3, "continent": "Africa", "country":"Kenya"},
    {"id": 4, "continent": "Europe", "country":"Spain"},
  ];

And i am showing the continent in a drop down

 DropdownButton<String>(
          isExpanded: true,
          isDense: true,
          hint: new Text("Select"),
          value: _mySelection,
          onChanged: (String newValue) {
            setState(() {
              _mySelection = newValue;
            });

            print(_mySelection);

          },
          items: myJson.map((Map val) {
            return new DropdownMenuItem<String>(
              value: val["continent"].toString(),
              child: Text(
                val["continent"],
              ),
            );
          }).toList(),
        ),

The above code does not work. any time i run it i get this error on the console.

A non-null String must be provided to a Text widget.
'package:flutter/src/widgets/text.dart':
Failed assertion: line 285 pos 10: 'data != null'

I want to show a list of African countries and populate it in another Dropdown(e.g country dropdown) if a select Africa from the current drop down. i have search for solutions but most of the solutions on Stack overflow are not related to my situation. thanks in advance.

Upvotes: 0

Views: 324

Answers (1)

FloW
FloW

Reputation: 1266

hopefully you are looking for something like this

you can groupBy your List, then you have only distinct continents

collection.dart is required

import "package:collection/collection.dart";
var newMap = groupBy(myJson, (obj) => obj['continent']);

in the new Map the key is your groupBy Field, you can do it the same for the countrys

              items: newMap.entries.map((val) {
                return new DropdownMenuItem<String>(
                  value: val.key.toString(),
                  child: Text(
                    val.key,
                  ),
                );
              }).toList(),

Upvotes: 1

Related Questions