Nikolaycc

Nikolaycc

reconnect during upload

Environment

  • Elixir version (elixir -v): 1.15.4
  • Phoenix version (mix deps): 1.7.7
  • Phoenix LiveView version (mix deps): 0.19.5
  • Operating system: Ubuntu
  • Browsers you attempted to reproduce this bug on (the more the merrier): Firefox
  • Does the problem persist after removing “assets/node_modules” and trying again? Yes/no: no

Actual behavior

When I upload some file it reconnects

<form id="upload-form" phx-submit="savee" phx-change="vali">
      <div class="container" phx-drop-target={@uploads.image.ref}>
            <.live_file_input upload={@uploads.image} />   
      </div>
      <button type="submit">Upload</button>
</form>
[error] GenServer #PID<0.547.0> terminating
** (KeyError) key "phx-F3d9rya2kNrrOwUD" not found in: %{"phx-F3d9ryLkHbHrOwTD" => :image}
    :erlang.map_get("phx-F3d9rya2kNrrOwUD", %{"phx-F3d9ryLkHbHrOwTD" => :image})
    (phoenix_live_view 0.19.5) lib/phoenix_live_view/upload.ex:192: Phoenix.LiveView.Upload.get_upload_by_ref!/2
    (phoenix_live_view 0.19.5) lib/phoenix_live_view/channel.ex:1218: anonymous fn/3 in Phoenix.LiveView.Channel.maybe_update_uploads/2
    (stdlib 5.0.2) maps.erl:416: :maps.fold_1/4
    (phoenix_live_view 0.19.5) lib/phoenix_live_view/channel.ex:218: Phoenix.LiveView.Channel.handle_info/2
    (stdlib 5.0.2) gen_server.erl:1077: :gen_server.try_handle_info/3
    (stdlib 5.0.2) gen_server.erl:1165: :gen_server.handle_msg/6
    (stdlib 5.0.2) proc_lib.erl:241: :proc_lib.init_p_do_apply/3

Most Liked

D4no0

D4no0

This is not a reconnect, that is a crash, the reconnect happens because the process is restarted by supervisor automatically.

Last Post!

Nikolaycc

Nikolaycc

defmodule MmautoWeb.PartLive.FormComponent do
  use MmautoWeb, :live_component

  alias Mmauto.Accounts

  @impl true
  def render(assigns) do
    ~H"""
    <div>
      <.header>
        <%= @title %>
        <:subtitle>Use this form to manage part records in your database.</:subtitle>
      </.header>

      <.simple_form   
        for={@form}
        id="part-form"
        phx-target={@myself}
        phx-change="validate"
        phx-submit="save"
        multipart
      >
        <.input field={@form[:name]} type="text" label="Name" />
        <.input field={@form[:dec]} type="text" label="Made in" />
        <!-- <.input field={@form[:image]} type="file" label="image" /> THIS NOT WORKING  -->
        <.input field={@form[:price]} type="number" label="Price" />
        <.input field={@form[:brand]} type="text" label="Brand" />
        <.input field={@form[:model]} type="text" label="Model" />
        <.input field={@form[:pnum]} type="number" label="Part Number" />
        <.input field={@form[:instock]} type="checkbox" label="Instock" />
        <.input field={@form[:stock1]} type="number" label="Stock N1" />
        <.input field={@form[:stock2]} class="mx-2" type="number" label="Stock N2" />
        <.input field={@form[:stock3]} type="number" label="Stock N3" />
        <.input field={@form[:id]} type="text" label="Id" />
        <:actions>
          <.button phx-disable-with="Saving...">Save Part</.button>
        </:actions>
      </.simple_form>
      <!-- same here -->
      <form id="upload-form" phx-submit="savee" phx-change="vali">
      <div class="container">
      <.live_file_input upload={@uploads.image} />   
      </div>
      <button type="submit">Upload</button>
      </form>
    </div>
    """
  end

  @impl true
  def mount(_params, _session, socket) do
    {:ok, socket
    |> assign(:upload_file, nil)
    |> allow_upload(:image, accept: ~w(.jpg .jpeg .png), max_entries: 1)
    }
  end

  
  @impl true
  def update(%{part: part} = assigns, socket) do
    changeset = Accounts.change_part(part)

    {:ok,
     socket
     |> assign(assigns)
     |> assign_form(changeset)
     |> allow_upload(:image, accept: ~w(.jpg .jpeg .png), max_entries: 1)}
  end

  @impl true
  def handle_event("validate", params, socket) do
    part_params = params["part"]
    IO.inspect socket.assigns
 
    changeset =
      socket.assigns.part
      |> Accounts.change_part(part_params)
      |> Map.put(:action, :validate)

    {:noreply, assign_form(socket, changeset)}
  end

  @impl true
  def handle_event("vali", %{"image" => image}, socket) do
      IO.inspect image

      changeset =
                socket
                |> assign(:id, nil)

      {:noreply, assign_form(socket, changeset)}
  end

  @impl true
  def handle_event("vali", %{"image" => image}, socket) do
      IO.inspect image
      IO.inspect socket.assigns

      changeset =
                socket
                |> assign(:id, nil)

      {:noreply, assign_form(socket, changeset)}
  end

  def handle_event("save", %{"part" => part_params}, socket) do
    IO.inspect part_params
    save_part(socket, socket.assigns.action, part_params)
  end

  def handle_event("savee", param, socket) do
    IO.inspect param
    IO.inspect socket.assigns
    {:noreply, socket}
  end

  defp save_part(socket, :edit, part_params) do
    case Accounts.update_part(socket.assigns.part, part_params) do
      {:ok, part} ->
        notify_parent({:saved, part})

        {:noreply,
         socket
         |> put_flash(:info, "Part updated successfully")
         |> push_patch(to: socket.assigns.patch)}

      {:error, %Ecto.Changeset{} = changeset} ->
        {:noreply, assign_form(socket, changeset)}
    end
  end

  defp save_part(socket, :new, part_params) do
    IO.puts "New"
    IO.inspect part_params

    IO.puts "hello" 
    IO.inspect socket.assigns.uploads.image
    case Accounts.create_part(part_params) do
      {:ok, part} ->
        notify_parent({:saved, part})

        {:noreply,
         socket
         |> put_flash(:info, "Part created successfully")
         |> push_patch(to: socket.assigns.patch)}

      {:error, %Ecto.Changeset{} = changeset} ->
        {:noreply, assign_form(socket, changeset)}
    end
  end

  defp assign_form(socket, %Ecto.Changeset{} = changeset) do
    assign(socket, :form, to_form(changeset))
  end

  defp notify_parent(msg), do: send(self(), {__MODULE__, msg})
end

Where Next?

Popular in Questions Top

lastday4you
I wanted to check elixir version in phoenix because i found that my elixir is 1.5 but when i use Enum.chunk_by it said the function is un...
New
sergio_101
I am VERY much an elixir newbie. I have taken one elixir course and one phoenix course on Udemy. During that course, I saw the instructor...
New
jerry
Good day to you all. I have been struggling to get a query involving like and ilike to work. Can anyone assist me on this, please? pro...
New
pmjoe
I have a relationship of love and hate with Elixir. Lots of things are just absolutely right, but there are some things that are kind of ...
New
SoCreat
i’m a new one to elixir which editor can i use vs code? or atom? Thanks! :smiley:
New
romenigld
I am trying to run a deploy with docker and I successfully runned with this command: docker build -t romenigld/blog-prod . but when I t...
New
senggen
Erlang/OTP 25 [erts-13.2.2] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] 15:22:35.803 [error] gen_event {lager_file_backend...
New

Other popular topics Top

vertexbuffer
Hello, can anybody help here..? I have a list of players and I what to delete an element, but every for loop the list is reverting to ori...
New
Darmani72
If I have a post route which an argument: post /my_post_route/:my_param1, MyController.my_post_handler How would get the post params ...
New
gausby
I asked this very same question on twitter and got some interesting feedback, but I thought it would be a good question to ask here as we...
1207 40165 209
New
shijith.k
I am trying to start a new phoenix project with elixir 1.9, but mix phx.new does not work. It says that ** (Mix) The task "phx.new" could...
New
alice
Hey, Just curious what are the main benefits of Elixir compared to Clojure? When is Elixir more useful than Clojure and vice versa? Th...
New
AstonJ
Posting this to see if we can make things easier for people to get into Neovim. If you use Neovim and have a favourite distro please let ...
New

We're in Beta

About us Mission Statement