Update the product in the database

Update the product in the database.

Now when you tap on the update button on the home page, probably because you want to modify something in the choosen product.

By clicking on that button you navigate to update_product_page.dart by passing a product object in the constructor from the home page.

1st step

First thing we need to import the product model.

import '../models/product.dart';
import '../services/dbhelper.dart';

2nd step

We need to create the constructor for that class.

  final Product product;
  const UpdateProductPage({@required this.product});

In the home_page.dart we need to pass the product in the constructor when we click on the edit button.

// onPressed from the edit button in the home page
 onPressed: () {
    Navigator.of(context).push(
        MaterialPageRoute(
        builder: (context) =>
            UpdateProductPage(product: product),
        ),
    );
    },

Now let's declare some objects for our fields.

  TextEditingController teName = TextEditingController();
  TextEditingController teDescription = TextEditingController();
  TextEditingController tePrice = TextEditingController();
  DbHelper helper;

  @override
  void initState() {
    super.initState();
    helper = DbHelper();
    teName.text = widget.product.name;
    teDescription.text = widget.product.description;
    tePrice.text = widget.product.price.toString();
  }

Now here is the final code for the update_product_page.dart.

import 'package:flutter/material.dart';
import '../models/product.dart';
import '../services/dbhelper.dart';

class UpdateProductPage extends StatefulWidget {
  final Product product;
  const UpdateProductPage({@required this.product});

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

class _UpdateProductPageState extends State<UpdateProductPage> {
  TextEditingController teName = TextEditingController();
  TextEditingController teDescription = TextEditingController();
  TextEditingController tePrice = TextEditingController();
  DbHelper helper;

  @override
  void initState() {
    super.initState();
    helper = DbHelper();
    teName.text = widget.product.name;
    teDescription.text = widget.product.description;
    tePrice.text = widget.product.price.toString();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Update product"),
      ),
      body: ListView(
        padding: const EdgeInsets.all(16),
        children: [
          TextFormField(
            controller: teName,
            decoration: InputDecoration(
              hintText: 'Enter new product name',
              labelText: 'Product name',
            ),
            onChanged: (value) {},
          ),
          SizedBox(height: 16),
          TextFormField(
            controller: teDescription,
            decoration: InputDecoration(
              hintText: 'Enter new product description',
              labelText: 'Product description',
            ),
            onChanged: (value) {},
          ),
          SizedBox(height: 16),
          TextFormField(
            controller: tePrice,
            keyboardType: TextInputType.number,
            decoration: InputDecoration(
              hintText: 'Enter new product price',
              labelText: 'Product price',
            ),
            onChanged: (value) {},
          ),
          SizedBox(height: 16),
          RaisedButton(
            child: Text('Save'),
            onPressed: () {
              setState(() {
                helper.updateProduct(Product({
                  'id': widget.product.id,
                  'name': teName.text,
                  'description': teDescription.text,
                  'price': double.parse(tePrice.text),
                }));
                Navigator.pop(context);
              });
            },
          ),
        ],
      ),
    );
  }
}

Now if you choose a product and modify it informations and click on the save button, you'll notice that in the home page the product is updated.