I have a shopping cart and I want users to be able to change the quantity using LiveView.
This form looks something like this:
<%= f = form_for @changeset, "#", [phx_change: :quantity_update] %>
<%= hidden_input f, :id, name: "id" %>
<%= number_input(f, :quantity, phx_blur: "blur_field")%>
</form>
This is inside of an if statement; if the current item is not the item being updated then I just show a numerical input but it’s not hooked up to a form and there is no associated changeset. This is so multiple items can be in the cart at once and only the quantity on one will be updated.
My thought is that whenever the user changes something in the number_input it will automatically be saved, and when the field loses focus it will stop updating.
However, every time handle_event\3 quantity_update is called the field looses focus anyway. Am I approaching this wrong? What is the best way to go about updating a record on a change event without losing focus on the form field?
For some extra context:
Template:
<%= if @update_id == item.id do %>
<%= f = form_for @changeset, "#", [phx_change: :quantity_update] %>
<%= hidden_input f, :id, name: "id" %>
<%= number_input(f, :quantity, phx_blur: "blur")%>
</form>
<% else %>
<input phx-click="update_quantity<%= item.id %>" type="number" step="1" value="<%= quantity(item) %>"</input>
<% end %>
Liveview:
def handle_event("quantity_update", params, socket) do
...
item
|> Item.changeset(params)
|> Repo.update()
|> case do
{:ok, _res} ->
{: noreply, socket
|> assign(:cart, Carts.get(socket.assigns.cart))
|> put_flash(:info, "Quantity updated")}
...
end
def handle_event("blur", _, socket) do
socket
|> assign(update_id: nil)
|> noreply()
end
