how to make drop down in flutter of comma separated values from sqflite column

Question

i want dropdown in flutter which value comes from sqflite database. the sample value is

    {
            "id": 5,
            "name": "New",
            "stages": "{\"Lead in\":false,\"Contacted\":false,\"Demo Presented\":false,\"Proposal Sent\":false,\"t4eg4ehhhe4h\":false,\"Extra Features Discussed\":false,\"Negotiation\":false,\"Closure\":false}",
            "created_at": "2019-05-03 17:49:05",
            "updated_at": "2019-06-06 16:16:04",
            "deleted_at": null
        },

i need dropdown of stages like lead in, contacted, demo presented, proposal and below is my code

                              FutureBuilder(
                              future: pipelineHelper.getPipeStage(pipelineId),
                              builder: (BuildContext context,
                                  AsyncSnapshot<List<Pipeline>>
                                  snapshot) {
                                if (!snapshot.hasData)
                                  return CircularProgressIndicator();
                                return DropdownButton(
                                  items: snapshot.data
                                      .map((stageList) => DropdownMenuItem<Pipeline>(
                                    value: stageList, child: Text(stageList.stages),))
                                      .toList(),
                                  onChanged: (actList) {
                                    setState(() {
                                      stageName = actList.title;
                                      debugPrint('stage selected');
                                    });
                                  },
                                  isExpanded: true,
                                );
                              })

i dont know how to split dynamic future list and i got {\"Lead in\":false,\"Contacted\":false,\"Demo Presented\":false,\"Proposal Sent\":false,\"t4eg4ehhhe4h\":false,\"Extra Features Discussed\":false,\"Negotiation\":false,\"Closure\":false} on dropdown. Below is my helper code

Future<List<Pipeline>> getPipeStage(int number) async {
Database db = await this.database;
var orgMapList = await db.rawQuery('SELECT $colStages from $pipeTable WHERE $colId = $number'); // Get 'Map List' from database
int count = orgMapList.length;
 List<Pipeline> pipeList = List<Pipeline>();
// For loop to create a 'Pipeline List' from a 'Map List'
for (int i = 0; i < count; i++) {
  pipeList.add(Pipeline.fromMapObject(orgMapList[i]));
}
return pipeList;

}

if i do this, The getter 'stages' isn't defined for the class 'List' error was visible

            items: snapshot.data.stages.split(',')

Answer 1

If I understand you clear
In your code pipelineHelper.getPipeStage(pipelineId) return only one record of PipeLine
So AsyncSnapshot List Pipeline should change to AsyncSnapshot Pipeline
and in items can use split to split comma and return DropdownMenuItem

items: snapshot.data.stage
                    .split(', ')

full code

import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:http/http.dart' as http;

void main() => runApp(MyApp());

// To parse this JSON data, do
//
//     final stages = stagesFromJson(jsonString);

List<Pipeline> stagesFromJson(String str) =>
    List<Pipeline>.from(json.decode(str).map((x) => Pipeline.fromJson(x)));

String stagesToJson(List<Pipeline> data) =>
    json.encode(List<dynamic>.from(data.map((x) => x.toJson())));

class Pipeline {
  String pipelineId;
  String stage;

  Pipeline({
    this.pipelineId,
    this.stage,
  });

  factory Pipeline.fromJson(Map<String, dynamic> json) => Pipeline(
        pipelineId: json["pipelineId"],
        stage: json["stage"],
      );

  Map<String, dynamic> toJson() => {
        "pipelineId": pipelineId,
        "stage": stage,
      };
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        // This is the theme of your application.
        //
        // Try running your application with "flutter run". You'll see the
        // application has a blue toolbar. Then, without quitting the app, try
        // changing the primarySwatch below to Colors.green and then invoke
        // "hot reload" (press "r" in the console where you ran "flutter run",
        // or simply save your changes to "hot reload" in a Flutter IDE).
        // Notice that the counter didn't reset back to zero; the application
        // is not restarted.
        primarySwatch: Colors.blue,
      ),
      home: JsonApiDropdown(),
    );
  }
}

class JsonApiDropdown extends StatefulWidget {
  @override
  JsonApiDropdownState createState() {
    return new JsonApiDropdownState();
  }
}

class JsonApiDropdownState extends State<JsonApiDropdown> {
  String _currentSelection;

  final String uri = 'https://jsonplaceholder.typicode.com/users';

  Future<Pipeline> _fetchstage() async {
    String jsonString =
        '[ { "pipelineId": "CDG0008", "stage": "stage1, stage2, stage3" }, { "pipelineId": "CDG0004", "stage": "Ceo - Chief Executive Officer" } ]';
    final stages = stagesFromJson(jsonString);
    return stages[0];
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Fetching data from JSON - DropdownButton'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.max,
          children: <Widget>[
            FutureBuilder<Pipeline>(
                future: _fetchstage(),
                builder:
                    (BuildContext context, AsyncSnapshot<Pipeline> snapshot) {
                  if (!snapshot.hasData) return CircularProgressIndicator();
                  return DropdownButton<String>(
                    items: snapshot.data.stage
                        .split(', ')
                        .map((data) => DropdownMenuItem<String>(
                              child: Text(data),
                              value: data,
                            ))
                        .toList(),
                    onChanged: (String value) {
                      setState(() {
                        _currentSelection = value;
                      });
                    },
                    isExpanded: false,
                    //value: _currentUser,
                    hint: Text('Select User'),
                  );
                }),
            SizedBox(height: 20.0),
            _currentSelection != null
                ? Text("selection : " + _currentSelection)
                : Text("No selected"),
          ],
        ),
      ),
    );
  }
}