Clear search does not fire onSearch and does not clear the filter

[informatikTirol]

Hi, clear search does not fire onSearch event and does not show the complete selectable list again. I have to type character and delete it again to see to complete list, see video.

"@ionic/angular": "^7.5.0",
 "ionic-selectable": "^5.0.3",

THX!

https://github.com/eakoriakin/ionic-selectable/assets/16346085/e4916a31-0466-48e5-a147-37edaefdc08d

[TheSakyo]

Have you solved the problem, that would be very useful ?

I have the same problem, would it be possible to implement an onClearSearch function for an event when on clear search. I saw that there was already a _onSearchbarClear() function in component, but it returns void and it has no parameters🤷🏼‍♂️.

[AndreasGBS]

No, unfortunately not yet

[TheSakyo]

If it helps, after studying the component, I found a solution. Unfortunately, I couldn't find any other way to do it, it's a "workaround", so there is a way to rewrite a function with javascript.

So I rewrote the _onSearchbarClear() function:

this.selectableComponent._onSearchbarClear = function()
{
    this._searchText = ''; // Clear Search Text
    this._filterItems(); // Reeffects a filter on the items
}

this._filterItems() is a function of the ionic-selectable component that filters items. this.selectableComponent is a ViewChild that retrieves my ionic selectable component: @ViewChild('selectableComponent') selectableComponent!: IonicSelectableComponent;.

I hope I've been able to help you solve your problem.

(it's best to write the code I sent you in the 'ngAfterViewInit()' angular lifecycle)

[AndreasGBS]

@TheSakyo THX, I'll give it a try and report back

[Lucasrsv1]

I noticed this same issue today on my app, but @TheSakyo 's workaround was not working for me.

So instead I used patch-package and added the line this._filterItems(); directly in the files inside node_modules.

Until this bug is properly fixed on this repository, if anyone would like to use the same patch I made, you can download the patch file here: ionic-selectable+5.0.3.patch

In order to use it, create a folder named patches and put the patch file inside it. Then, run npm i -D patch-package and add "postinstall": "patch-package" to your package.json scripts. After that, whenever you run npm install the patch will be automatically applied to node_modules.

[AndreasGBS]

Thanks @Lucasrsv1, I'll try that too. Unfortunately, @TheSakyo's solution didn't work for me either. Hopefully this will be solved directly by the component in the medium term.