The way I typically achieve this these days is:

1. Set up a regular Phoenix Form with a text input and a change event handler.
2. Add a debounce on the text input, e.g. phx-debounce="500". That way the search doesn’t happen on literally every keystroke. (Which would slam the DB more than necessary.)
3. In the change handler, perform the search and set the results in an assigns variable.
4. In the HTML, if there are any search results, display an autosuggest “dropdown”.

I don’t think there’s a need to complicate it with iframes or nested LiveViews.

The docs about debouncing are here:

Much could be said about building an effective autosuggest component for [4] but I don’t think that’s the focus of your question.

That would make sense, thanks. I am using live_render/3 for child LiveComponents. However, I thought that might lead to issues because some of my views are LiveViews and some are not. So at some pages the search box is actually inside a LiveView in others it isn’t.

Thanks for the hint with the :sticky option. I will try it out.

It didn’t click with me that this is not fully a LiveView app. My bad!