Form update error: No function clause matching in Phoenix.HTML.Form.input_changed?/3

Phoenix Forum Questions / Help
,
1

Hey all,

I’m running into a problem I haven’t been able to solve after handling user input and updating the socket with new data. I’m guessing I’ve setup the form incorrectly in a way that is getting in the way of change tracking? Really appreciate any help identifying the issue!

Here is the error:

** (FunctionClauseError) no function clause matching in Phoenix.HTML.Form.input_changed?/3
(phoenix_html 3.3.2) lib/phoenix_html/form.ex:197: Phoenix.HTML.Form.input_changed?(%Phoenix.HTML.Form{source: %{“end_date” => ~D[2023-07-31], “start_date” => ~D[2022-09-03]}, impl: Phoenix.HTML.FormData.Map, id: nil, name: nil, data: %{}, hidden: [], params: %{“end_date” => ~D[2023-07-31], “start_date” => ~D[2022-09-03]}, errors: [], options: [], index: nil, action: nil}, %Phoenix.HTML.Form{source: %{“end_date” => ~D[2023-07-31], “start_date” => ~D[2022-09-01]}, impl: Phoenix.HTML.FormData.Map, id: nil, name: nil, data: %{}, hidden: [], params: %{“end_date” => ~D[2023-07-31], “start_date” => ~D[2022-09-01]}, errors: [], options: [], index: nil, action: nil}, “end_date”)

I’m using to_form to build the form from a map (no changeset).

data = %{“start_date” => start_date}
date_range_form = to_form(data)

The form itself is in a LiveComponent and looks like this:

<.simple_form
for={@date_range_form}

<.label for="start_date">Date Start</.label>
<.input
  phx-change="update_start_date"
  field={@date_range_form["start_date"]}
  type="date"
/>

…
</.simple_form>

Thanks!

2

I ran also into this, it should be fixed on phoenix_html main: Support string fields in input_changed?/3 by dvic · Pull Request #428 · phoenixframework/phoenix_html · GitHub

1 Like
3

Thanks for your reply!

When I had tried using string keys in the map supplied to to_form I got warnings that atom keys are not allowed.

The solution was just to use string keys for the map, but use atom keys in the form.

So,

data = %{"start_date" => elem(spec.date_range, 0)}
form = to_form(data)

and

<.input
  phx-change="update_start_date"
  field={@date_range[:start_date]}
  type="date"
/>