Background
I have a LiveView page where I have a small form. This form is supposed ton have a group of radio buttons, and a group of checkboxes.
To achieve this, I am trying to use Form Bindings:
Code
This is what I currently have. I want to give the user the option to receive notifications about some topics.
For the radio button group, the user chooses whether to receive the notification via email or sms. These are mutually exclusive.
For the checkbox group, the user chooses the topics. These are not mutually exclusive.
This is my html.heex file:
<.form for={@form} phx-submit="save">
<.input id={"email"} name="notifications" type="radio" value={"email"} field={@form[:notifications]} />
<.input id={"sms"} name="notifications" type="radio" value={"sms"} field={@form[:notifications]} />
<.input id={"sports"} name="topics" type="checkbox" value={"sports"} field={@form[:topics]} />
<.input id={"science"} name="topics" type="checkbox" value={"science"} field={@form[:topics]} />
<button>Save</button>
</.form>
And this is the corresponding LivewView:
defmodule MyApp.Settings do
use MyApp, :live_view
@impl true
def mount(_params, _session, socket) do
form = to_form(%{})
updated_socket = assign(socket, form: form)
{:ok, updated_socket}
end
def handle_event(event, params, socket) do
Logger.info("Event: #{inspect(event)} ; #{inspect(params)}")
{:noreply, socket}
end
end
If you are a keen reader, you will see I have no label, or legend tags anywhere. This is for simplification purposes.
Problem
Even though I get the correct value for the "notifications" radio group, the problem is that my checkboxes always return true or false:
[debug] HANDLE EVENT "save" in MyApp.Settings
Parameters: %{"notifications" => "sms", "topics" => "true"}
This is rather confusing. I was expecting something like:
Parameters: %{"notifications" => "sms", "topics" => ["sports", "science"]}
After reading the relevant parts of the docs, I don’t think the type checkbox is considered a special type, so it is not documented (in the link above mentioned).
I also don’t quite understand why I need a schema when to_form seems to work perfectly fine with %{}.
Questions
- How can I get a list of values instead of a boolean for checkboxes?
- I don’t use schemas in my application. Can
to_formwork with a Struct? - What would be the benefit of passing a Struct to
to_form?
