How to solve this "The getter 'length' was called on null" - json

Question

I have a php file hosted on my college server and when i run this file on the server it works very well. I can get the json data after running my php file which is in the link http://www.alkadhum-col.edu.iq/Teachers%20Activities/get.php but when i was unable to got them when i had tried that in flutter on the app screen got "the getter 'length'was called on null".
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
void main() {
runApp(Workshops());
}
class Workshops extends StatelessWidget {
#override
Widget build(BuildContext mycontext) {
return MaterialApp(
home:Scaffold(
appBar: AppBar(
backgroundColor: Color.fromRGBO( 52, 73, 94, 1.0),
automaticallyImplyLeading: false, // Don't show the leading button
title: new Text("PHP with Flutter"),
),
body: PostScreen(),
)
);
}
}
class PostScreen extends StatefulWidget {
#override
_PostScreenState createState() => _PostScreenState();
}
class _PostScreenState extends State<PostScreen> {
List<Post> _postList = new List<Post>();
Future<List<Post>> fetchPost() async {
final response =
await http.get('http://www.alkadhum-col.edu.iq/Teachers%20Activities/get.php');
if (response.statusCode == 200) {
// If the call to the server was successful, parse the JSON
List<dynamic> values = new List<dynamic>();
values = json.decode(response.body);
if (values.length > 0) {
for (int i = 0; i < values.length; i++) {
if (values[i] != null) {
Map<String, dynamic> map = values[i];
_postList.add(Post.fromJson(map));
}
}
}
return _postList;
} else {
// If that call was not successful, throw an error.
throw Exception('Failed to load post');
}
}
#override
Widget build(BuildContext context) {
return FutureBuilder<List<Post>>(
future: fetchPost(),
builder: (_, AsyncSnapshot<List<Post>> snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return Center(child: CircularProgressIndicator());
}
return ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (_, index) {
//dynamic post = snapshot.data[index];
return (Container(
margin: EdgeInsets.symmetric(vertical: 2.0, horizontal: 8.0),
child: new Card(
elevation: 10.0,
child: new Container(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
new Text(snapshot.data[index].name, style: TextStyle(fontSize: 18.0),),
new Text(snapshot.data[index].msg, style: TextStyle(fontSize: 18.0),),
new Text(snapshot.data[index].day, style: TextStyle(fontSize: 18.0),),
new Text(snapshot.data[index].date, style: TextStyle(fontSize: 18.0),),
],
),
),
),
));
},
);
},
);
}
#override
void initState() {
super.initState();
fetchPost();
}
}
class Post {
String name;
String msg;
String day;
String date;
Post({this.name, this.msg, this.day, this.date});
factory Post.fromJson(Map<String, dynamic> json) {
return Post(
name: json['name'],
msg: json['msg'],
day: json['day'],
date:json['date']
);
}
}
How to fix this issue?.
Thanks in advance.

Answer 1

I've looked at your link and tried running the code and I think the issue is in the data returned from your link.
[{"name":"م.م علي ستار باراني","msg":"امتحان مادة قواعد البيانات اول جابترين ","day":"السبت","date":"2019-06-20"}][{"name":"م. امجد عباس التميمي","msg":"امتحان مادة هندسة البرامجيات اول فصلين","day":"الاحد","date":"2019-06-21"},{"name":"م.م علي ستار باراني","msg":"امتحان مادة قواعد البيانات اول جابترين ","day":"السبت","date":"2019-06-20"}]
Right after the first object, you have a closing square bracket and no comma separating it from the opening square bracket beside it. Calling json.decode() on the link body throws the following error
FormatException (FormatException: Unexpected character (at character 115)
...,"day":"السبت","date":"2019-06-20"}][{"name":"م. امجد عباس التميمي","msg...
^
)
After fixing that, it runs fine for me. I tested by taking the body of the link manually and removing the offending characters, leaving me with the json below.
[{"name":"م.م علي ستار باراني","msg":"امتحان مادة قواعد البيانات اول جابترين ","day":"السبت","date":"2019-06-20"},{"name":"م. امجد عباس التميمي","msg":"امتحان مادة هندسة البرامجيات اول فصلين","day":"الاحد","date":"2019-06-21"},{"name":"م.م علي ستار باراني","msg":"امتحان مادة قواعد البيانات اول جابترين ","day":"السبت","date":"2019-06-20"}]
Running the app now displays the following:

Answer 2

make sure to always check for nulls in itemCount like this
ListView.builder(
itemCount: snapshot.data.length == null ? 0 :snapshot.data.length,
itemBuilder: (_, index){}
),
With this if your list is null, the itemCount will return a 0.

Answer 3

Just do this to the list List<Post> _postList = [] that happens its that everything it a object in Dart so when you do this List<Post> _postList = new List<Post>(); your variable _postList is equal to null because has been declared but not initialize so by default it null and you will not be able to use any property for the list until it initialize.
in resume just initialize your list like this: an empty list
List<Post> _postList = [];
So you don't have that issue.