PHPFixing
  • Privacy Policy
  • TOS
  • Ask Question
  • Contact Us
  • Home
  • PHP
  • Programming
  • SQL Injection
  • Web3.0

Saturday, July 23, 2022

[FIXED] How to retrieve data from List<Map<String, dynamic>> model in DataTable flutter?

 July 23, 2022     flutter, json, model, nested     No comments   

Issue

let's say I have a model like this ...

class UserModel {
  UserModel({
    required this.data1,
    required this.data2,
    required this.sessions,
  });

  String data1;
  String data2;
  List<Map<String, dynamic>> sessions;
}

and I have variable data like this ...

var userData = [
  UserModel(
    data1: 'Jhon Doe',
    data2: 'Research',
    sessions: [
      {"date": "20 june", "status": "good", "durations": 13},
      {"date": "22 june", "status": "good", "durations": 33},
      {"date": "23 june", "status": "excellent", "durations": 23},
      {"date": "25 june", "status": "good", "durations": 60}
    ],
  ),
  UserModel(
    data1: 'Jean Doe',
    data2: 'Research',
    sessions: [
      {"date": "20 june", "status": "good", "durations": 13},
      {"date": "22 june", "status": "excellent", "durations": 33},
      {"date": "23 june", "status": "excellent", "durations": 23},
      {"date": "25 june", "status": "good", "durations": 60}
    ],
  ),
  UserModel(
    data1: 'Mark Doe',
    data2: 'Resource',
    sessions: [
      {"date": "20 june", "status": "low", "durations": 30},
      {"date": "22 june", "status": "good", "durations": 13},
      {"date": "23 june", "status": "excellent", "durations": 23},
      {"date": "25 june", "status": "good", "durations": 60}
    ],
  ),
];

so, How do I retrieve only all "status" in Map of every User?

I hope you can share the answers, Thanks... cheers

UPDATE!

I tried to implement it in Datatable Flutter this is my full code...

class DetailPage extends StatefulWidget {

  //selected user variable
  final UserModel element;

  const DetailPage({Key? key, required this.element}) : super(key: key);

  @override
  State<DetailPage> createState() => _DetailPageState();
}

class _DetailPageState extends State<DetailPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(...),
      ),
      body: LayoutBuilder(
          builder: (BuildContext context, BoxConstraints constraints) {
        return ListView(
          children: [
            _createDataTable(),
          ],
        );
      }),
    );
  }
}

DataTable _createDataTable() {
  return DataTable(columns: _createColumns(), rows: _createRows());
}

List<DataColumn> _createColumns() {
  return [
    const DataColumn(label: Text('Date')),
    const DataColumn(label: Text('Status')),
    const DataColumn(label: Text('Durations')),
  ];
}

List<DataRow> _createRows() {
  return [
    for (var element in userData) {
      for (var elementSession in element.sessions) {
        DataRow(cells: [
          DataCell(Text(elementSession['date'])),
          DataCell(Text(elementSession['status'])),
          DataCell(Text(elementSession['durations'])),
        ]);
      }
    })
  ];
}

The problem is, The argument type 'List.dynamic.' can't be assigned to the parameter type 'List.DataRow.'.


Solution

Thank you for the previous answer so I can figure out the logic and solve the problem by reversing the code, I got the answer to a similar question from StackOverflow.

hire my working full code :

class DetailPage extends StatefulWidget {
  //selected user constructor
  final UserModel? elementUser;

  const DetailPage({Key? key, this.elementUser}) : super(key: key);

  @override
  State<DetailPage> createState() => _DetailPageState();
}

class _DetailPageState extends State<DetailPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(...),
      ),
      body: LayoutBuilder(
          builder: (BuildContext context, BoxConstraints constraints) {
        return ListView(
          children: [
            //widget dataTable tag
            _createDataTable(widget.elementUser),
          ],
        );
      }),
    );
  }
}

_createDataTable(UserModel? elementUser) {
  //List<DataRow> 
  List<DataRow> rows = [];
  
  //generate selected user nested data
  for (var row in elementUser!.sessions) {
    rows.add(
      DataRow(
        cells: [
          DataCell(
            Text(row['date']),
          ),
          DataCell(
            Text(row['status']),
          ),
          DataCell(
            Text(row['durations'].toString()),
          ),
        ],
      ),
    );
  }
  
  //create dataTable
  return DataTable(
    columns: _createColumns(),
    rows: rows,
  );
}

//List<DataColumn>
List<DataColumn> _createColumns() {
  return [
    const DataColumn(label: Text('Date')),
    const DataColumn(label: Text('Status')),
    const DataColumn(label: Text('Durations')),
  ];
}


Answered By - DVCone
Answer Checked By - Marilyn (PHPFixing Volunteer)
  • Share This:  
  •  Facebook
  •  Twitter
  •  Stumble
  •  Digg
Newer Post Older Post Home

0 Comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Total Pageviews

Featured Post

Why Learn PHP Programming

Why Learn PHP Programming A widely-used open source scripting language PHP is one of the most popular programming languages in the world. It...

Subscribe To

Posts
Atom
Posts
Comments
Atom
Comments

Copyright © PHPFixing