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.