[Q] Preserving the state of the search field

[burekas7]

Use case

Hi,

How can I preserve the state of the search field input and only refresh the initial list on which it is performed?
Because every time the widget refreshes the search field is reset and the list displays all the content again.

[koukibadr]

You can hold the state of the search field seperatly in text field controller and set the search field value from this text field controller

[burekas7]

@koukibadr
Thanks for the reply.

Do you have an example for that?

I tried to implement, the text is indeed saved,
but the filtering by the search field doesn't work unless I click on the search box
(and here it also works after the first time,
after another rendering even clicking on the search field doesn't perform the filtering unless another character is typed).

I tried to add use of focus and make a request for focus after the widget is rendered using:

  Widget build(BuildContext context) {
    WidgetsBinding.instance.addPostFrameCallback((_) async {
      focusNode.requestFocus();
    });

  ...

  SearchableList<LocationInfo>(
        focusNode: focusNode,
        searchTextController: _textEditingController,

but it doesn't help.

[burekas7]

@koukibadr

Any idea?

[burekas7]

Maybe it relates to?

    widget.searchTextController?.removeListener(_textControllerListener);

[koukibadr]

@burekas7
apart from holding the state of the search field you need to keep track of the filtered list state also,
so the state class is something like this

class MyState() {
   String searchFieldValue = "";
   List<Object> filteredList = [];
   List<Object> originalList = [];
}

Next in the SearchableListview, in the initialList pass the value of filteredList, for the searchField initialize it with the searchFieldValue and in the filtering callback use the originalList to update the filteredList.
Don't forget also to update the searchFieldValue in the onChange callback

[burekas7]

@koukibadr
Thanks

1. How do I get the output filtered list that made by the widget according to the "filter" callback?
   Or should I filter the list manually outside from the internal filtering in the "onChange"?

2. There is no "onChange" callback, do you mean by listener on the "searchTextController"?

3. If I'm actually use "searchTextController" I guess that I don't actually need the "searchFieldValue"

[koukibadr]

@burekas7

1. in the filter callback set your state list with the new filter output you've done in the callback
   and also return the filter result in the same callback so the Searchable listview re-render correctly

filter: (query) {  }

2. you're right there's no onChange calllback for the search field (it could be a good enhancement) but for now you can use the TextEditingController and listen to its changes, and use searchTextController parameter to link it to the SearchableListview

textEditingController.addListener(() {
      print(textEditingController.text);
    });

[koukibadr]

@burekas7 this issue has been resolved in my last PR pushed I'll provide more details once I push a new release