Api Call With Nested Map Flutter - json

Question

I am trying to make a POST call to my server that requires my data to be shaped like this:
{
"dispensary": 1,
"order_detail": [
{"product_size": 1,
"quantity": 1}
]
}
But when I make my api call, I get a 500 error on my back end saying the data looks like this:
{'{"dispensary":1,"order_detail":{"product_size":1,"quantity":1}}': ['']}
I am making the call like this:
Future getdata(dispensary, order) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
var token = prefs.getString('token');
var url = '$server/api/customer/order/getdata/?access_token=$token';
Map<String, dynamic> orderRating = {
'dispensary': dispensary,
'order_detail': order
};
await http.post(url, body: orderRating, headers: {
"Content-Type": "application/x-www-form-urlencoded"
}).then((http.Response response) {
switch (response.statusCode) {
case (200):
var responseData = json.decode(response.body);
Rate rateData =
Rate.fromJson((responseData[1]['rate_response']['rates']));
print('uploaded successfully');
print(rateData.carrierId);
break;
case (400):
print('Bad Data');
break;
case (500):
print('Failed Upload');
isUploaded = false;
break;
default:
print('Unable to get rates');
}
});
print('uploaded successfully');
}
With order_detail being a map itself of {"product_size": 1,
"quantity": 1}.
I cannot complete the call to my server. Could you tell me what I'm doing wrong

Answer 1

I don't get exactly what are you doing, because it's not the whole future function in it ... but I can make a guess you're trying to make a post request, where the body have some dynamic data.
What are you doing right now as far as I can see is that you're putting a map inside a map which is not what you want.
My suggestion is something like this:
Future<http.Response> postSomething(int dispensary, List<Map<String,dynamic>> order) async {
final String url = 'yoururl';
final Map<String, dynamic> body = {
'dispensary': dispensary,
'order_detail': order
};
final request = await http.post(url: url, body: convert.jsonEncode(body));
if(request.statusCode == 200) {
return something
} else {
throw Exception('Failed to send the request!!!')
}
}
Hope that my answer will help you and give a clearer idea. :)

Answer 2

Add the toJson methods to your objects. call toJson when generating your requests body
body: orderRating.toJson
should return the json structure as seen in this snippet
{
"dispensary": 1,
"order_detail": [
{"product_size": 1,
"quantity": 1}
]
}
class OrderRating{
int dispensary;
List<OrderDetail> orderDetail;
OrderRating({this.dispensary, this.orderDetail});
OrderRating.fromJson(Map<String, dynamic> json) {
dispensary = json['dispensary'];
if (json['order_detail'] != null) {
orderDetail = new List<OrderDetail>();
json['order_detail'].forEach((v) {
orderDetail.add(new OrderDetail.fromJson(v));
});
}
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['dispensary'] = this.dispensary;
if (this.orderDetail != null) {
data['order_detail'] = this.orderDetail.map((v) => v.toJson()).toList();
}
return data;
}
}
class OrderDetail {
int productSize;
int quantity;
OrderDetail({this.productSize, this.quantity});
OrderDetail.fromJson(Map<String, dynamic> json) {
productSize = json['product_size'];
quantity = json['quantity'];
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['product_size'] = this.productSize;
data['quantity'] = this.quantity;
return data;
}
}
The above code was generated using a tool found Here