I have an API and what I am trying to do is to display the 'CourseTitle' from the JSON into the ExpansionTile title and the corresponding 'Title', 'EndDate', 'QuizStatus' in the children of ExpansionTile.

If data is not available for corresponding 'Title', 'EndDate', 'QuizStatus' etc., only 'CourseTitle' should be added to the ExpansionTile title, and children should be empty.

The first tile is built as expected but the remaining screen shows a red screen with RangeError (index): Invalid value: Valid value range is empty: 1.

I'm aware that this is because of empty data from JSON but couldn't solve the issue.

Here's JSON response:

{
    "QuizzesData": [
        {
            "request_status": "Successful",
            "CourseCode": "ABC101",
            "CourseTitle": "ABC Course",
            "UnReadStatus": [],
            "Quizzes": [
                {
                    "QuizID": "542",
                    "Title": "Test Quiz 01",
                    "StartDate": "Oct 20, 2022 12:00 AM",
                    "EndDate": "Oct 31, 2022 11:59 PM",
                    "IsDeclared": "False",
                    "Questions": "5",
                    "TotalMarks": "5",
                    "MarksObtained": "1",
                    "MarksObtainedTOCheckQuizResult": "1",
                    "QuizIsDeclared": "Un-Declared",
                    "StudentSubmitStatus": "true",
                    "IsRead": "1",
                    "QuizStatus": "Attempted"
                }
            ]
        },
        {
            "CourseCode": "DEF101",
            "CourseTitle": "DEF Course",
            "UnReadStatus": [],
            "Quizzes": []
        },
        {
            "CourseCode": "GHI101",
            "CourseTitle": "GHI Course",
            "UnReadStatus": [],
            "Quizzes": []
        },
        {
            "CourseCode": "JKL101",
            "CourseTitle": "JKL Course",
            "UnReadStatus": [],
            "Quizzes": []
        },
 
    ]
}

Here's the API data:

  var listofdata ;
  Future quizListingApi() async {
    final response = await http.get(Uri.parse('json url'));
    if(response.statusCode == 200){
       listofdata = jsonDecode(response.body.toString());
     }
     else{
    print(response.statusCode);
     }

and the build method:

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Expanded(child: FutureBuilder(
            future: quizListingApi(),
            builder: (context, AsyncSnapshot snapshot){
              if(snapshot.connectionState == ConnectionState.waiting){
                return Text('Loading');
              }
              else{
                return ListView.builder(
                  itemCount: listofdata['QuizzesData'].length,
                    itemBuilder: (context, index){
                    return Card(
                      child: Column(
                        children: [
                          ExpansionTile(
                              title: Text(listofdata['QuizzesData'][index]['CourseTitle']),
                            children: [
                              Text(listofdata['QuizzesData'][index]['Quizzes'][index]['Title']),
                              Text(listofdata['QuizzesData'][index]['Quizzes'][index]['EndDate']),
                              Text(listofdata['QuizzesData'][index]['Quizzes'][index]['QuizStatus']),
                            ],
                          ),
                        ],
                      ),
                    );
                    }
                );
              }
            },
          ))
        ],
      ),
    );
  }

I also tried answers from other similar threads but couldn't find the solution for this specific type of problem.

CodePudding user response：

Your Quizzes's index are not same as your listofdata, so you need and other for loop for your Quizzes's items:

ExpansionTile(
  title: Text(listofdata['QuizzesData'][index]['CourseTitle']),
  children: List<Widget>.generate(listofdata['QuizzesData'][index]['Quizzes'].length, (i) => Column(
    children: [
        Text(listofdata['QuizzesData'][index]['Quizzes'][i]
        ['Title']),
    Text(listofdata['QuizzesData'][index]['Quizzes'][i]
        ['EndDate']),
    Text(listofdata['QuizzesData'][index]['Quizzes'][i]
        ['QuizStatus']),
    ],
  ),),
),