Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – Dropdown in ListView

I have listview that contain this dropdown. Items of the drop are shown, it’s from API, but it throw some error when i select the value

Either zero or 2 or more [DropdownMenuItem]s were detected with the same value
‘package:flutter/src/material/dropdown.dart’:
Failed assertion: line 888 pos 15: ‘items == null || items.isEmpty || value == null ||
items.where((DropdownMenuItem item) {
return item.value == value;
}).length == 1’"

I guess it’s throw that error because of duplicate dropdown in the lisview that use same item.I think it’s should use index for different the dropdown. Any suggestions code examples please!

List? answerList;

This is function to fetch data:

void answerSetupDropdown() async {
    var headers = {
      'Accept': 'application/json',
      'Content-Type': 'application/json',
    };
    var request =
        http.Request('POST', Uri.parse(baseLaravelAPI + '/api/start_section'));
    request.body = json.encode({
      "staffid": widget.staffId.toString(),
      "form_open_id": widget.formOpenId.toString(),
      "section_id": widget.sectionId.toString(),
      "form_id": widget.formId.toString(),
      "confirm_no": widget.confNo.toString()
    });
    request.headers.addAll(headers);

    http.StreamedResponse response = await request.send();

    if (response.statusCode == 200) {
      final res = jsonDecode(await response.stream.bytesToString());
      answerList = res["data"]["answer_list"];
      loading = false;
    } else {
      throw Exception('Unable to fetch products from the REST API');
    } 
    
  }

This is dropdown that show the item:

 ListView.builder(
                itemCount: chilList!.length,
                
                itemBuilder: (context, i) {
loading == false
                                    ? Expanded(
                                        // alignment: Alignment.centerLeft,
                                        child: Theme(
                                          data: Theme.of(context).copyWith(
                                            unselectedWidgetColor: lightblue,
                                          ),
                                          child: DropdownButton<dynamic>(
                                            underline: SizedBox(),
                                            hint: Text("Select Answer"),
                                            value: selectedValue,
                                            onChanged: (dynamic value) {
                                              setState(() {
                                                selectedValue =
                                                    (value["answer_name"])
                                                        .toString();
                                              });
                                              // selectedValue =
                                              //     (valueSel["answer_name"])
                                              //         .toString();
                                            },
                                            items: answerList!.map((answer) {
                                              return DropdownMenuItem<dynamic>(
                                                value: answer,
                                                child: Row(
                                                  children: <Widget>[
                                                    SizedBox(
                                                      width: 10,
                                                    ),
                                                    Text(
                                                      answer["answer_name"]
                                                          .toString(),
                                                      style: TextStyle(
                                                          color: Color(
                                                              int.parse((answer[
                                                                      "answer_color"])
                                                                  .replaceAll(
                                                                      RegExp(
                                                                          '#'),
                                                                      '0xFF')))),
                                                    ),
                                                  ],
                                                ),
                                              );
                                            }).toList(),
                                          ),
                                        ),
                                      )
                                    : CircularProgressIndicator(),
                  });
Tags:

2

Answers


  1. 0

    Ensure that the selectedValue is unique for each item

    Login or Signup to reply.
  2. 0

    That means your answerList variable has 2 identical values. Because DropdownMenuItem value must be unique.

    In example:

    Bad

    List answerList = [1,2,3,3];

    It’s bad because answer has two 3 (not unique), it will confusing DropdownButton

    Good

    List answerList = [1, 3, 5, 6, 8, 9];

    It’s good because all value in the list is unique. So DropdownButton can identify which one is selected by your value

    Code Example

    DropdownButton(
  items: answerList.map(
    (answer) => DropdownMenuItem(
      // So when you iterate this dropdownmenuitem, make sure
      // this [value] is unique, no duplicated [answer].
      value: answer,
      child: Text('$answer'),
    ),
  ),
  onChanged: onChanged,
)
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search