I have a list of log entries served by the backend. I want to add a filtering feature which allows to restrict results while typing, requesting the new filtered list to the backend passing the typed filter string.
The problem is that when the result is returned and the View is updated, the inpunt field lose focus and this force the user to click on the input field to continue typing the filter. This is not very smooth.
Is there a way to avoid (o restore) the focus and the cursor position on the input field after a view repaint?
Unfortunately at the moment I don’t have the code at hand.
The part of the view for log entries is an ElmUI Column with three rows:
first row containing the filter input
second row containing the log entries list
the third row containing a link to load more log entries
It seems that the entire ElmUI column is removed. I removed the second row in Elm but the problem persists. So is not because of the list of entries being updated.
I added DOM breakpoints (removal, subtree modification, attributes modification) in each row but no break occurs.
Adding a DOM removal breakpoint in che ElmUI Column node, breaks so is the column which is removed.
Okay. I have found the issue. Nothing to do with keyed elements.
The problem is mine. I’m using a loading view while loading data but obviously this view ‘erases’ the previous view every time. I need to manage the loading phase in a different way.