search

WebDevStudios / wp-search-with-algolia

Improve search on your site. Autocomplete is included, along with full control over look, feel and relevance.
https://wordpress.org/plugins/wp-search-with-algolia/
141 stars 54 forks source link

Persist autocomplete results even if the input isn't focused anymore #286

Closed samunderwood closed 1 year ago

samunderwood commented 1 year ago

Is your feature request related to a problem? Please describe. I'd like to be able to keep the algolia autocomplete results visible even when the user is no longer focused on the search input. For example, I have a modal that shows the search input when the user searches, but if they click on an area that isn't the input, the results hide. This becomes especially poor UX on mobile, as if the user closes their keyboard to make it easier to see all results, the results disappear.

Describe the solution you'd like The ability to disable the hide when the input is no longer in focused. With this option, the autocomplete results will persist in the DOM and be displayed when the user stops focusing on the input.

Describe alternatives you've considered I tried to disable the openOnFocus in the automcomplete.php config, but this didn't do what I wanted.

Additional context Example of the modal with search input.

screenshot 2023-01-16 at 14 12 05

tw2113 commented 1 year ago

I believe there's some persistence available when SCRIPT_DEBUG is enabled, but that's also meant more for during development of the autocomplete experience. Not sure if that's going to match your intended needs here.

peiche commented 1 year ago

I set debug (https://github.com/WebDevStudios/wp-search-with-algolia/blob/main/templates/autocomplete.php#L156) to true for my implementation. My search is inside a modal as well.

samunderwood commented 1 year ago

This is exactly what I wanted. Thanks!

Unsure if setting this to true enables anything else? If so, it may be worth considering adding a separation option?

tw2113 commented 1 year ago

Honestly not something custom we did up. This came from https://github.com/algolia/autocomplete/tree/v0.38.0#global-options and the "debug" property they allow.

tw2113 commented 1 year ago

Closing as a non issue.