boiserunner

boiserunner

Changeset with radio buttons

I have a LiveView that creates a changeset on mount and validate.

defp build_changeset(data) do
    types = %{email: :string, distance_id: :integer}
    changeset = {data, types} |> Ecto.Changeset.cast(%{}, Map.keys(types)) |> Ecto.Changeset.validate_required([:email, :distance_id])
    changeset
end

And a simple form. It presents multiple options to the user, so I’m relying on a wrapping a radio

<.form as={:form} for={@changeset} :let={f} phx-change="validate" phx-submit="save">
    <.input field={f[:email]} type="email" />
    <%= for vd <- @distances do %>
      <label
        for={"form_distance_id_" <> to_string(vd.id)}>
        <input type="radio" id={"form_distance_id_" <> to_string(vd.id)} name="form[distance_id]" value={vd.id} class="sr-only" />
        <!-- various aesthetic elements -->
      </label>
    <% end %>
...

When I first click one of these labels, my validate event fires and I see params for my changeset:

Parameters: %{"_target" => ["form", "email"], "form" => %{"distance_id" => "23", "email" => "test@test.com"}}

However, if I start editing the email field, the distance_id is wiped away.

Parameters: %{"_target" => ["form", "email"], "form" => %{"email" => "test@test.com"}}

Without complete form values, I can only rebuild a partial changeset, thus wiping out prior user selections. Anything stand out?

Marked As Solved

benwilson512

benwilson512

Author of Craft GraphQL APIs in Elixir with Absinthe

Hey @boiserunner you need to set a checked attribute on the input that has the value you’ve set. Something like:

<input type="radio" ... checked={get_field(@changeset, :distance_id) == vd.id) />

Also Liked

boiserunner

boiserunner

Confirmed, this works.

Not a complete face-palm moment, but maybe like… 65%? 70%?

Thank you!

Where Next?

Popular in Questions Top

RisingFromAshes
I’ve read in another post that it may be possible with a router helper - but I couldn’t find an appropriate one, and tbh, I’m still just ...
New
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
Qqwy
Original source of discussion: This topic on the Pragmatic Programmers’ Functional Web Development with Elixir, OTP, and Phoenix forum. ...
New
vonH
When I run the Plug and I recompile I wind up having to use Ctrl C to quit iex and start again. Witht the help of rlwrap I can use the cu...
New
lessless
I believe there are people here who are dealing with CSV files import on the daily basis, and since Excel is a really popular tool there ...
New
albydarned
Hello all! I am typing this post from my new MacBook Pro with the M1 chip. I’m loving it so far, and will probably use it as my daily dr...
New
SoCreat
i’m a new one to elixir which editor can i use vs code? or atom? Thanks! :smiley:
New

Other popular topics Top

jononomo
I am trying to figure out how Mix knows whether the environment is test, dev, or prod – where is this set? Thanks.
New
nsuchy
Hi. I’ve noticed that Windows Powershell has it’s own IEX command and you cannot access Elixir’s IEX due to the conflict. This isn’t a cr...
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
bsollish-terakeet
Credo is smart enough to check for (something like) this: assert length(the_list) == 0 with this response: Checking if an enum is empt...
New
SoCreat
i’m a new one to elixir which editor can i use vs code? or atom? Thanks! :smiley:
New
jason.o
In the code below, if the create action is not set to accept “extra_key” as an input, it errors out with a message shown above. Is there ...
New

We're in Beta

About us Mission Statement