Hello!
I have a single text input field in a form to add users and show them as “tags” next to the input field. The idea is to search for user while typing and adding them to the list when selection the autocompletion suggestion.
<.form let={f} for={:user_list}
phx_change="suggest-staff"
phx_submit="save-admin-users"
>
<%= for email <- @admin_user_emails do %>
<%= email %>
<% end %>
<%= text_input f, :user_email,
value: @entered_user_email,
autocomplete: "off",
list: "user_suggestions",
phx_keydown: "select-suggestion" %>
<datalist id="user_suggestions">
<%= for suggestion <- @user_suggestions do %>
<option value={suggestion}><%= suggestion %></option>
<% end %>
</datalist>
</.form>
def handle_event(
"select-suggestion",
%{"key" => key, "value" => value},
socket
) do
if key in ["Enter", "Tab", " "] do
# do stuff
{:noreply,
assign(socket,
entered_user_email: ""
)}
else
{:noreply, socket}
end
end
The form is not attached to any schema. I am using value
to in the text input field to control its value. After adding a value from the suggestion list I’d like to reset the value
to `"". It does not work, probably because I still have the focus of the input field while doing the reset. Any idea how to fix that?