Flutter : Search Bar problem with data based on JSON/Model

Question

Let me explain .. when I do a search in my search bar it works but I can't go back in the search bar, more specifically when I erase the text it doesn't go back.

Here is my function to filter. displayProduct shows me all the data from my data source (nb: model created from JSON data)

  void searchProduct(String query) {
    final response = displayProduct?.where((element) {
      final titleProduct = element.title?.toLowerCase();
      final input = query.toLowerCase();

      return titleProduct!.contains(input);
    }).toList();
    setState(() {
      displayProduct = response;
    });
  }

Here The textField in which I am searching

TextField(
       onChanged: searchProduct,
       decoration: InputDecoration(
            prefixIcon: Icon(Icons.search_outlined),
            hintText: "Product title",
            border: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(10),
                  borderSide: const BorderSide(
                  color: Color.fromARGB(255, 228, 179, 63)
                  )
            ),
       ),
)

• Here is the screen before typing

• Here When i search it works

• But if I erase the text in the search bar there is no return to the starting screen

• and if I try to re-type a text no more items are displayed

Answer 1

Please refer the below code

 void searchProduct(String query) {
        if(query.isNotEmpty){
        final response = displayProduct?.where((element) {
          final titleProduct = element.title?.toLowerCase();
          final input = query.toLowerCase();
    
          return titleProduct!.contains(input);
        }).toList();
        setState(() {
          displayProduct = response;
        });
        } else{
    setState(
           //your api data list
    );
            }
              }