Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to create an object from a Datarow of Datatable in Flutter

I'm quite new to flutter and I'm building a shopping app, which list the order items in a table. The user will fill out the row field such as Price and Amount. I want to know how do I create an object of order items from each row of table. Please help me! I'm stuck with this problem a few days already.

here is a link to example table

Here is the code of each row

    rows: orderedProducts
      .map((product) => DataRow(cells: [
           DataCell(Text(product.productName)),
           DataCell(
             TextFormField(
               onSaved: (String value) {
                 takeNumber(value, product.id);
                },
             keyboardType: TextInputType.number,
              ),),
           DataCell(
             TextFormField(
                onSaved: (String value) {
                   takeNumber(value, product.id);
                },
             keyboardType: TextInputType.number,
            ),),])).toList()),
like image 300
Coldie Man Avatar asked Dec 06 '22 09:12

Coldie Man


1 Answers

The following example is Datatable with TextField
In the example below, data came from List and First name is editable

full demo code with edit and add/print all button

import 'package:flutter/material.dart';

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

class MyMaterialApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'flutter_typeahead demo',
      home: DataTableDemo(),
    );
  }
}

class User {
  String firstName;
  String lastName;

  User({this.firstName, this.lastName});

  static List<User> getUsers() {
    return users;
    /*return <User>[
      User(firstName: "Aaryan", lastName: "Shah"),
      User(firstName: "Ben", lastName: "John"),
      User(firstName: "Carrie", lastName: "Brown"),
      User(firstName: "Deep", lastName: "Sen"),
      User(firstName: "Emily", lastName: "Jane"),
    ];*/
  }

  static addUsers(firstName, lastName) {
    var user = new User();
    user.firstName = firstName;
    user.lastName = lastName;
    users.add(user);
  }
}

List<User> users = [];

class DataTableDemo extends StatefulWidget {
  DataTableDemo() : super();

  final String title = "Data Table Flutter Demo";

  @override
  DataTableDemoState createState() => DataTableDemoState();
}

class DataTableDemoState extends State<DataTableDemo> {
  List<User> users;
  List<User> selectedUsers;
  bool sort;

  @override
  void initState() {
    sort = false;
    selectedUsers = [];
    users = User.getUsers();
    super.initState();
  }

  onSortColum(int columnIndex, bool ascending) {
    if (columnIndex == 0) {
      if (ascending) {
        users.sort((a, b) => a.firstName.compareTo(b.firstName));
      } else {
        users.sort((a, b) => b.firstName.compareTo(a.firstName));
      }
    }
  }

  onSelectedRow(bool selected, User user) async {
    setState(() {
      if (selected) {
        selectedUsers.add(user);
      } else {
        selectedUsers.remove(user);
      }
    });
  }

  deleteSelected() async {
    setState(() {
      if (selectedUsers.isNotEmpty) {
        List<User> temp = [];
        temp.addAll(selectedUsers);
        for (User user in temp) {
          users.remove(user);
          selectedUsers.remove(user);
        }
      }
    });
  }

  SingleChildScrollView dataBody() {
    return SingleChildScrollView(
      scrollDirection: Axis.vertical,
      child: Column(
        children: <Widget>[
          MaterialButton(
            child: Text('add button'),
            onPressed: () {
              var user = new User();
              user.firstName = "default firstName";
              user.lastName = "default lastName";
              users.add(user);
              setState(() {});
            },
          ),
          MaterialButton(
            child: Text('print all button'),
            onPressed: () {
              users.forEach((u) => print("${u.firstName} ${u.lastName}"));
            },
          ),
          DataTable(
            sortAscending: sort,
            sortColumnIndex: 0,
            columns: [
              DataColumn(
                  label: Text("FIRST NAME"),
                  numeric: false,
                  tooltip: "This is First Name",
                  onSort: (columnIndex, ascending) {
                    setState(() {
                      sort = !sort;
                    });
                    onSortColum(columnIndex, ascending);
                  }),
              DataColumn(
                label: Text("LAST NAME"),
                numeric: false,
                tooltip: "This is Last Name",
              ),
            ],
            rows: users
                .map(
                  (user) => DataRow(
                          selected: selectedUsers.contains(user),
                          onSelectChanged: (b) {
                            print("Onselect");
                            onSelectedRow(b, user);
                          },
                          cells: [
                            DataCell(
                              //Text(user.firstName),
                              TextField(
                                onChanged: (text) {
                                  print("First text field: $text");
                                  user.firstName = text;
                                },
                              ),
                            ),
                            DataCell(
                              Text(user.lastName),
                            ),
                          ]),
                )
                .toList(),
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Column(
        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.center,
        verticalDirection: VerticalDirection.down,
        children: <Widget>[
          Expanded(
            child: dataBody(),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Padding(
                padding: EdgeInsets.all(20.0),
                child: OutlineButton(
                  child: Text('SELECTED ${selectedUsers.length}'),
                  onPressed: () {},
                ),
              ),
              Padding(
                padding: EdgeInsets.all(20.0),
                child: OutlineButton(
                  child: Text('DELETE SELECTED'),
                  onPressed: selectedUsers.isEmpty
                      ? null
                      : () {
                          deleteSelected();
                        },
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }
}

result when click print all button

I/flutter (13851): abc default lastName
I/flutter (13851): def default lastName

enter image description here

like image 81
chunhunghan Avatar answered Dec 22 '22 00:12

chunhunghan